ok guys so ive got this so far, my html page and the css that lays it out, i need someone to put three columns in under the nav bar, all three columns must be the same width all together as the nav bar, can anyone help me #container{ width: 75%; display: absolute; margin: 0 auto; border: 1px solid #FFF; } p#logo{ width: 387px; height: 69px; background: url(media/logo.png); margin: 10px 0 20px 45px; } p#side{ float: left; width: 200px; height: 500px; border: 5px solid #678b3f; margin: 10px 0 0 0; } p#rfl{ float: left; width: 350px; height: 170px; background: url(media/rfl.png); margin: 10px 0 0 20px; } #testbox{ display: left; width: 173px; height: 66px; background: url(media/testbox.png); margin: 0 0 0 0px; } .sidefont{ font: normal 11px Arial, Verdana, sans-serif; } .ddcolortabs{ padding: 0; width: 90%; background: transparent; voice-family: "\"}\""; voice-family: inherit; } .ddcolortabs ul{ font: normal 11px Arial, Verdana, sans-serif; margin:0; padding:0; list-style:none; } .ddcolortabs li{ display:inline; margin:0 2px 0 0; padding:0; text-transform:uppercase; } .ddcolortabs a{ float: left; color: white; background: #678b3f url(media/color_tabs_left.gif) no-repeat left top; margin:0 2px 0 0; padding:0 0 1px 3px; text-decoration:none; letter-spacing: 1px; } .ddcolortabs a span{ float: left; display:block; background: transparent url(media/color_tabs_right.gif) no-repeat right top; padding: 6px 8px 3px 7px; } .ddcolortabs a span{ float: left; } .ddcolortabs a:hover{ background-color: #8cb85c; } .ddcolortabs a:hover span{ background-color: #8cb85c; } .ddcolortabs a.current, #ddcolortabs a.current span{ /*currently selected tab*/ background-color: #8cb85c; } .ddcolortabsline{ clear: both; padding: 10px 0 0 0; width: 90%; height: 8px; line-height: 8px; background: #678b3f; border-top: 1px solid #fff; /*Remove this to remove border between bar and tabs*/ } .tabcontainer{ clear: left; padding: 6px 0 0 0; width: 100%; height: 15px; line-height: 8px; background: #678b3f; border-top: 1px solid #fff; /*Remove this to remove border between bar and tabs*/ } .tabcontent{ display:none; float: left; padding: 0 0 0 55px; } Code (markup): <!-- CSS for Tab Menu #4 --> <link rel="stylesheet" type="text/css" href="ddtabmenufiles/ddcolortabs.css" /> <script type="text/javascript"> //SYNTAX: ddtabmenu.definemenu("tab_menu_id", integer OR "auto") ddtabmenu.definemenu("ddtabs4", 0) //initialize Tab Menu #4 with 3rd tab selected </script> <body> <div id="container"> <p id="logo"><a href="index.html"></a></p> <center> <div id="ddtabs4" class="ddcolortabs"> <ul> <li><a href="http://www.link.com" rel="ct1"><span>Home</span></a></li> <li><a href="http://www.link.com/new.htm" rel="ct2"><span>HTML</span></a></li> <li><a href="http://www.link.com/style/" rel="ct3"><span>CSS</span></a></li> <li><a href="http://www.link.com/forums/"><span>Forums</span></a></li> <li><a href="http://www.link.com"><span>random link</span></a></li> </ul> </div> <DIV class="tabcontainer"> <div id="ct1" class="tabcontent"> Bacon, sausage and egg </div> <div id="ct2" class="tabcontent"> Bacon cheese and egg </div> <div id="ct3" class="tabcontent"> Bacon hash brown and egg </div> </DIV> </div> </body> </html> Code (markup): the food words are just my own "lorem ipsum" lol