Pure Css Horiontal Menus

Download pure css horizontal menus in 6 colors click here for demo (click on images to download particular menu) works in all browsers.

Red Css Menu

blue Css Menu

Green Css Menu

Orange Css Menu

Purple Css Menu

More Menu Styles to come please let me know if you face any problem in browsers you can also leave your suggestions and you can also mail me for psd files.

30 Responses to Pure Css Horiontal Menus

  1. Joe says:

    Hmmm, seems cool.

    Joe joestain13@yahoo.com

  2. wasko74 says:

    Hi, very nice menus. This will work with a transparent background, or in a degradé background?

  3. hi wasko, this menus r not for transparent if u want to use this menus for transparent then just mail me so that i can mail u the psd file so that u can convert it for transparent background.

  4. wasko74 says:

    Hi Santos

    This menus represents a great web 2.0 design work. I would like to use them in a website that i’m working on. In what conditions can i do that?

    If you don’t remember, i’m the guy that would like to use them in a transparent background. My mail is vasco.ms@gmail.com


  5. hi wasko just check ur mail

  6. Alan says:

    Hi, saw this on dynamic drive but a little confused…when put the code up there is the indentation to the left, so it does not fill 100% of the table…is there a way to fix this????

  7. Alan says:

    could I get the psd file as well? thanks! 🙂

  8. Hi Alan,
    what problem ur facing plz let me know so that i can guide u, coming to the code it is very easy to use and understand an it fill tables 100% no question in that, u can get menu psd files too just mail me.

  9. Alan says:

    Hi Santosh…I saw the code where you can extend it to 100% but it still does not do that. To the left, not right, there is what roughly looks like a 20px indent…I’ve tried everything and it won’t go away. Even on a clean html page with only the css and code it still happens. I’m using IE 7

  10. Matt says:

    I’m getting the same problem as Alan. I use FF, where it displays fine, but in IE7 which I have to check it comes up with this mysterious gap. I’ll try and post a link.

  11. Hi Matt,
    the problem in IE is IE browser it takes default browser css you need to reset it.
    how should i reset it?

    actually the problem with IE is we centered the menu
    margin:0 auto;/* to center */
    that it the reason why its taking left space.
    i hope your problem solved if not feel free to discuss i can assit you.

  12. […] Pure CSS Horizontal Menus with Images by WebDesignInfo – click here for preview […]

  13. Matt says:

    Brilliant! all sorted, thanks for your help.

  14. […] Blue, Green, Orange and Purple available at Santosh’s blog […]

  15. martynb says:

    Hello, Thanks for this great work but im still having problems trying to remove the lefthand gap in IE 7, Firefox works great i would be greatful for any advice

  16. hi martynb,
    can u give me link plz……….. so that i can guide u

  17. Patricia says:

    Hi Santosh,

    Gorgeous menu! Thank you for sharing it. Unfortunately, I have the same problem as the other two guys – re: a gap on the left in IE7. I’ve tried the reset but it’s not working. Can you help?

    All the best,

  18. hi patricia,
    reset the global styles to remove left space in IE.
    *html, body{

  19. nicholas balmer says:

    superb work

  20. These are some awesome menus. This is a fine design job!

    Keep up the good work here.

  21. Farah says:

    Hi, very nice menus. i need those in dark red colors humm some thing maroon, can u plz send me the psd.

  22. hi, nice and cool menus , i m going to use these in my coming websites. great yar keep it up.

  23. Sagar says:


    I really love this menu.. Looks the site richer…
    Thanks dude………

  24. Nice SHADOW effect, i just saw it after downloading.

  25. Steph2Switzerland says:

    Hello and congratulations for this wonderful menu,

    I am not very good at css, but how fair to add a sub-menu under show-case? Please

    Link 1
    Link 2

    And can you send me the psd buttons please.

    Thank you and see you soon

  26. The style of writing is quite familiar to me. Have you written guest posts for other blogs?

  27. sarveshvarma says:


    This menus represents a great design work. I would like to use them in a website that i’m working on.but i am confused somthing, In what conditions can i do that?

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out /  Change )

Google photo

You are commenting using your Google account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )

Connecting to %s

%d bloggers like this: