Ok I have the following code for my menu <div id="menu" style="float:left;"> <ul class="menu2"> <li class="current"><a href="#nogo"><b>Home</b></a></li> <li><a href="#nogo"><b>About Us</b></a></li> <li><a href="#nogo"><b>Sign Up</b></a></li> <li><a href="#nogo"><b>Unsubscribe</b></a></li> <li><a href="#nogo"><b>Advertise</b></a></li> <li><a href="#nogo"><b>Terms of Use</b></a></li> <li><a href="#nogo"><b>Contact Us</b></a></li> </ul> </div> Code (markup): .menu2 {padding:0 0 0 32px; margin:0; list-style:none; height:35px; background:#fff url(1.gif); position:relative; border:1px solid #000; border-width:0 1px; border-bottom:1px solid #444;} .menu2 li {float:left;} .menu2 li a {display:block; float:left; height:35px; line-height:35px; color:#aaa; text-decoration:none; font-size:11px; font-family:arial, verdana, sans-serif; font-weight:bold; text-align:center; padding:0 0 0 8px; cursor:pointer;} .menu2 li a b {float:left; display:block; padding:0 16px 0 8px;} .menu2 li.current a {color:#fff; background:url(2.gif);} .menu2 li.current a b {background:url(2.gif) no-repeat right top;} .menu2 li a:hover {color:#fff; background:#000 url(3.gif);} .menu2 li a:hover b {background:url(3.gif) no-repeat right top;} .menu2 li.current a:hover {color:#fff; background:#000 url(2.gif); cursor:default;} .menu2 li.current a:hover b {background:url(2.gif) no-repeat right top;} #menu{ width: 800px; background-color: FFFFFF; padding: 0px; border: 0px solid #FFFFFF; } Code (markup): I want the background of the menu to stretch all the way across the page but still have the buttons and text centered. What exactly would I have to do to do this? Ive looked at a few places that supposedly tell you how to but they are of no help
I've no idea. But I think you'd better post this question in the HTML/CSS forum. There you've got a better chance of finding someone that can help you.