Hi Guys
i am having a slight issue with my CSS drop down menu.
because the child links are being pulled out of a data base they can very in size when i role over the parent link its width expands to the width of the longest child link.
how can i keep the parent link at 110px, but allow child links to be as long as required?
i tried a few things most sucessful was setting a max-width: on the parent and a min-width: on the child, this worked in chrome but nothing else.
(see "gallery" role-over)
http://joemayhew.co.uk/full-bore/classics/index.php
the CSS:
the HTML:HTML Code:#menu ul ul { display:none; margin:0px; padding: 0px; background-color:#8c1818; color:#FFFFFF; float:none; z-index:100; /*min-width:250px;*/ } #menu li:hover ul{ display:block; } #menu li ul a:link { background-color:#66CCFF;} /*#menu li#link6 {max-width:110px;}*/
HTML Code:<div id="menu"> <ul> <li id='link1'> <a href='index.php'>Home</a></li> <li id='link2'> <a href='shop.php'>Shop</a> </li> <li id='link3'> <a href='bikes4sale.php'>Bikes for Sale</a></li> <li id='link4'> <a href='workshop.php'>Workshop</a> </li> <li id='link5'> <a href='contact.php'>Contact</a></li> <li id='link6'> <a href='gallery.php'>Gallery</a> <ul> <li><a href='photos.php?album=2'>Second Album</a></li> <li><a href='photos.php?album=1'>First Album</a></li> </ul> </li> <li id="link7"> <a href="links.php">Links</a> </li> </ul> </div>
Thanks in advance


Reply With Quote
Bookmarks