How to Create an Advanced CSS Menu
October 30th, 2007 Filed in: Tricks & Tips Jump to comments
A few people have asked me how did I create the sidebar menu on Web Designer Wall. Some people thought it was done by Javascript. Actually, it is just some basic CSS image replacement tricks. So I decided to write a tutorial on how to design and code an advanced CSS menu. Typically, a CSS menu either goes horizontal or vertical. In this tutorial I will show you how to utilize the CSS position property and place the menu buttons anywhere you want. It is a two-part tutorial (and don’t forget to Digg it):
- Part 1 - Design Watercolor Effect Menu (Photoshop)
- Part 2 - Advanced CSS Menu (CSS)


April 30th, 2008 at 2:29 pm
Navigation-bar is one of the most important element in a website..accessibility..navigability.. I love Your CSS!! Great Tutorial
April 5th, 2008 at 5:37 pm
Nice tutorial I think I might be using this in the future to add some more personality to my website. thanks for sharing!
-KG from the One Year Millionaire Blog
April 4th, 2008 at 4:35 pm
Great tutorial :) Simple but yet very complete! Useful for both new and experienced web developers.
I’ve bookmarked your blog to check it out later ;)
March 30th, 2008 at 11:54 am
Good tutorial
March 29th, 2008 at 11:22 am
thanks for this stuffs
March 28th, 2008 at 7:43 am
nice job
March 27th, 2008 at 3:33 am
Great done,
It’s excellent tips you have provided.
March 12th, 2008 at 7:23 am
thanks for sharing.
February 13th, 2008 at 6:18 am
Excellent tutorial, created a nice CSS menu.
Thnk you
February 8th, 2008 at 6:01 am
thx for share