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)
October 30th, 2007 at 3:55 am
Thanks for this nick… it is a great tutorial and will be trying it out soon !
October 30th, 2007 at 4:13 am
great post dude.
October 30th, 2007 at 10:05 pm
Great job nick :)
October 31st, 2007 at 7:07 pm
Great post! Thanks for the information. Your blog has been a great resource for myself over the past months. Danny.
November 1st, 2007 at 6:23 am
Thanks heaps Nick! This really came in handy.
November 8th, 2007 at 6:38 pm
Thanks Nick!
This was really cool!!
November 10th, 2007 at 10:31 pm
You job nick
November 11th, 2007 at 5:55 pm
this is a brilliant tutorial!
November 15th, 2007 at 6:23 am
Thank you for this nice tutorial. I’ve used this method on my new website. It looks so good :)
November 15th, 2007 at 5:36 pm
Thanks for sharing
November 17th, 2007 at 3:38 am
Excellent! It’s seem I need to subscribe to your feed. Thanks for sharing, photoshop work and css.
November 17th, 2007 at 7:08 am
It is amazing this site. I want to usk if you can design for my SEO blog? How much will cost one blog design in XHTML CSS. Thanks and respect
November 17th, 2007 at 8:15 am
nice job
November 18th, 2007 at 6:27 am
good job
November 21st, 2007 at 10:14 pm
Amazing job nick
November 24th, 2007 at 6:14 am
Good tut.
November 25th, 2007 at 2:32 pm
This menu is very cool, i will use it as i am redesigning my site.
December 2nd, 2007 at 1:14 am
Nice one indeed. I can sure use that.
December 7th, 2007 at 9:36 pm
Cool
December 14th, 2007 at 10:48 pm
i think i need to subscribe this feed… still learning ajax though =)
December 19th, 2007 at 10:38 pm
Thanks ,you are awlays very helpfull…The world would be a better place if there were more of you :)
December 21st, 2007 at 12:33 pm
Fantastic article. I intend to put some of these techniques to use on future sites :)
December 28th, 2007 at 6:49 pm
Thank you very very much!! This helped me out with a website I am making.
Thanks again!!
January 2nd, 2008 at 5:01 pm
Good Job man, this is awesome.
January 4th, 2008 at 3:46 pm
Very good tutorial…
January 8th, 2008 at 3:31 am
Thanks ,you are awlays very helpfull…The world would be a better place if there were more of you :)
January 18th, 2008 at 6:19 am
Hey, that’s a great tutorial, thanks a ton for the article!!!
January 24th, 2008 at 6:36 pm
Excellent tutorial, I have been using CSS only menus for at least the last 18 months. I think it the way of the future, anyone still using JS outside of a closed environment should be shot.
January 25th, 2008 at 2:15 pm
Very useful information. Thanks alot.
January 28th, 2008 at 3:17 pm
good and clean job.thanks for share..
January 29th, 2008 at 12:20 pm
thanks! Very good tutorial… Bunu mutlaka kullacağım.
February 4th, 2008 at 6:20 pm
thanks, it’s cool
February 6th, 2008 at 4:51 am
great work i liked
February 8th, 2008 at 6:01 am
thx for share
February 13th, 2008 at 6:18 am
Excellent tutorial, created a nice CSS menu.
Thnk you
March 12th, 2008 at 7:23 am
thanks for sharing.
March 27th, 2008 at 3:33 am
Great done,
It’s excellent tips you have provided.
March 28th, 2008 at 7:43 am
nice job
March 29th, 2008 at 11:22 am
thanks for this stuffs
March 30th, 2008 at 11:54 am
Good tutorial
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 ;)
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 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
May 9th, 2008 at 5:48 pm
Really nice tuttorials.Easy to use
thanks
May 10th, 2008 at 4:08 am
http://www.frmedya.com thanl you css for
May 10th, 2008 at 10:37 am
Great done,
It’s excellent tips you have provided.
May 10th, 2008 at 2:54 pm
excellent job thanks…