Jump to content

CSS Horizontal Menus


doaner6
 Share

Recommended Posts

I am looking to create a CSS based horizontal menu with 1 nested dropdown menu in it - all others will just be links. I have found code for either just a menu or for all categories having nested lists in them, but not a combination so far. Nothing fancy, no gradients or image replacements, just color changes which I can do once I get some code. Any suggestions for where to go?Thanks!!

Link to comment
Share on other sites

Maybe you want something like this:I haven't tested it, but it should work.CSS:

ul#nav {padding: 0;margin: 0;}ul#nav li {display: inline;position: relative;line-height: 1.5em;background-color: blue;}ul#nav li:hover {background-color: red;}ul#nav li ul {display: none;position: absolute;top: 1.5em;left: 0;}ul#nav li ul li { display: block; }ul#nav li:hover ul { display: block; }

HTML:

<ul id="nav"><li><a href="URL">Link</a></li><li><a href="URL">Link</a></li><li><a href="URL">Link</a></li><li>Submenu:  <ul>	<li><a href="URL">Link</a></li>	<li><a href="URL">Link</a></li>	<li><a href="URL">Link</a></li>  </ul></li></ul>

Link to comment
Share on other sites

Thank you Ingolme!! It needs tweaking, but this is a great help - I really appreciate it.

Maybe you want something like this:I haven't tested it, but it should work.
Link to comment
Share on other sites

There are enough here to use and tweak (these are free but use Javascript [which I don't see a problem with, AT ALL] ): http://www.dynamicdrive.com/dynamicindex1/droptabmenu.htmThis one doesn't use Javascript, just CSS but it might not be free: http://www.cssplay.co.uk/menus/dd_valid.htmlHope this helps.

Link to comment
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
 Share

×
×
  • Create New...