I am working on a tabbed menu from dynamic drive. I have it up but I can't figure out why 1. All the images do not show. 2. The bullets are still showing up. localracechat.com/menu.html Here is the CSS <LINK REL=StyleSheet HREF="http://www.localracechat.com/menu.css" TYPE="text/css" MEDIA=all> /*Credits: By Santosh Setty (http://webdesigninfo.wordpress.com) */ /*Posted to: Dynamic Drive CSS Library (http://www.dynamicdrive.com/style/) */ .glossymenu{ position: relative; padding: 0 0 0 34px; margin: 0 auto 0 auto; background: url(images/menu/menur_bg.gif) repeat-x; /*tab background image path*/ height: 46px; list-style: none; } .glossymenu li{ float:left; } .glossymenu li a{ float: left; display: block; color:#000; text-decoration: none; font-family: sans-serif; font-size: 13px; font-weight: bold; padding:0 0 0 16px; /*Padding to accomodate left tab image. Do not change*/ height: 46px; line-height: 46px; text-align: center; cursor: pointer; } .glossymenu li a b{ float: left; display: block; padding: 0 24px 0 8px; /*Padding of menu items*/ } .glossymenu li.current a, .glossymenu li a:hover{ color: #fff; background: url(images/menu/menur_hover_left.gif) no-repeat; /*left tab image path*/ background-position: left; } .glossymenu li.current a b, .glossymenu li a:hover b{ color: #fff; background: url(images/menu/menur_hover_right.gif) no-repeat right top; /*right tab image path*/ } </style> Code (markup): Source dynamicdrive.com/style/csslibrary/item/glossy_horizontal_menu/
looks Ok to me as well. maybe try taking out double 0 auto" in the margin areas. What I did initially with these is forget to make .gif images ( menu.gif ) You may already have them, but just trying to find a simple solution
Change list-style:none; to list-style-type:none;. That should fix your bullet problem. To fix your images problem, you put the images in the li part of your CSS, not the a part.
armatik, list-style is not the problem (since it's a shorthand version of list-style-type, which also covers other list styles as well). I use list-style: none; all the time, and have yet to have a problem with it. He can also put the background images in the anchor if the styles have been set up to handle them. As it is, the XHTML code doesn't validate (I'd fix those validation errors PDQ), and furthermore, I wouldn't trust anything to Dynamic Drive - the site just flat out SUCKS. And besides, this is just a blatant ripoff of the Sliding Doors of CSS, which was posted by Douglas Bowman on A List Apart anyway. http://www.alistapart.com/articles/slidingdoors/
Woops, pardon my embarrassing mistakes. That's just always the way I do it, so I thought maybe that might make it work.