Category: CSS
-
CSS map in practice
A few months ago I wrote an article about how to use CSS to create a nice looking map. The process was (I think) well explained in that article, and now I want to show you the real example — or how to use CSS and unordered list to create live, nice looking CSS map…
-
A few CSS and XHTML tips for web developers
These past two month I was very busy doing many designs, redesigns, logos, layouts, etc. I didn’t have much time to write an article on my blog and I’m sorry for that. In the past few weeks I sliced a lot of layouts and built a lot of new pages with much content. Doing that…
-
Image gallery that doesn’t fall apart
There are several techniques for laying out the image gallery (using list-items, simple IMG tags or using links when you create a “clickable” gallery). If you use any of available techniques, you should get the same or almost same effects. And everything works nice as long as you stick with the thumbnails of the same…
-
How to create a nice map using CSS and unordered list
For one of my personal projects, I needed to create a nice-looking map and position the elements in it. In the past, I would use Photoshop, and sketch the elements on layers that I can move, but today I will use (definitely) CSS. We will create an unordered list to achieve that. Nothing complex, just…
-
Creating news site heading like in Daylife.com Covers
A few days ago I stumbled upon an interesting news site called Daylife. Its front page (Covers) is something like an internet/TV hybrid, with its flash intro page that displays most recent news. To say the least, I am a fan of Flash, as of JavaScript and other technologies, but I think that the same…
-
Advanced forms
In you read the article about creating simple contact forms than you know what the most web designers will ever need. For those of you who need some advanced forms, this is the article for you. In this article I will not cover many things, because if you know the basics you could combine the…
-
CSS image replacement techniques
When you are engaged in web design process, one of the most helpful things is CSS image replacement technique. In this article, I will show you the basics you should know for replacing text with images. I will show you how to use a logo for Heading 1 (which is widely used for displaying company…
-
Create your own drop down menu with nested submenus using CSS and a little JavaScript
Drop down menus are among the coolest things on the web. Beside that they are also very good for creating navigations that contain many elements. The main problems of creating drop down menus lies in the Internet Explorer’s inappropriate way of displaying :hover pseudo class (not recognized anywhere except in A tag), and the problem…
-
Image with textual description
How to create image with textual description, and keep it simple? Maybe some nice text decoration? If you are wondering about that, this is the article for you, and it’s not even very long and difficult.
-
Creating menus: Horizontal navigation > Explained
Few days ago I was writing about creating vertical navigation using unordered lists and CSS. Now it is time to show you how to create horizontal navigation with the same things. The beauty of CSS is that we don’t need to change anything in the XHTML code of our previous navigation. Although there are no…
-
Learn how to design your own XHTML valid website
I know from my experience, that it’s not easy to make a switch between table-based design, and CSS-based design. Been there, done that – thank you. On the web there are many great resources and lessons for designing layout or navigation you can all find them on Google. There are also many documented problems between…
-
Creating menus: Vertical Navigation > Explained
In this article I will explain how to create simple vertical navigation menu with one sub-menu. I suppose there are many explanations of how to create vertical (and horizontal) navigation menus all over the web, but when I was just a beginner I learned to write both XHTML and CSS, but never really understood why…
-
Creating simple contact forms
Tables are designed to show tabular data. But they are also good for building contact forms, because of their easy positioning without having to write much CSS. In this article I will show you how to create simple contact form with less code and less CSS and no tables. Is that possible? You’ll find out.