Ian, On Jul 4, 2006, at 10:39 AM, Ian - Mediamint wrote:
> www.cmsserver.info > www.cmsserver.info/css/css.css > > The first is the buttons...if i take the doctype out they display as i > want them to (in IE at least - they won't display in firefox for some > reason) The #nav li are set to display: inline; which means they can't take a width or height. If you need to specify a width (as I suspect you do given the background you want to use) you will need to float them instead. Something like the following should get you close. However, this kind of interface has been done to death. Just go to Listomatic <http://css.maxdesign.com.au/listamatic/> and find the one that looks/behaves most like you want and use it as a starting point. The biggest problem with the current design is that if a user has her/his min font size set higher than you expect, the text will flow out of the tab and be unreadable. That's why most tab style menus only curve one corner and make the image oversize. #nav { padding: 0 0 0 3px; margin: 0; margin-bottom: -1px; float: left; } #nav li { padding: 0; margin: 0 3px; float: left; list-style-type: none; } #nav li a { font-family: Arial, Helvetica, sans-serif; font-weight: bold; text-align: center; color: #ffffff; font-size: 0.7em; text-decoration: none; padding: 5px 0; margin: 0; display: block; width: 5em; min-width: 100px; background: url(../images/nav.gif) no-repeat center; } #nav a.active, #nav a:hover { background: url(../images/nav_over.gif) no-repeat center; } hth -- Roger Roelofs "Remember, if you’re headed in the wrong direction, God allows U-turns!" ~Allison Gappa Bottke ______________________________________________________________________ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
