Mon, 2010-04-05 13:44
I am looking for the best way to make a change to this code. I want the inventory bar at the top to be 100% width, but the inventory items not to change their position relative to the 960px body below. Hopefully, the solution includes a wrapper surrounding the 960px body. Tx.
body { background: #xxx; font: 0.8em Helvetica, "Helvetica Neue", Arial, sans-serif; color: #xxx; margin: 0px; padding: 0; } div.page { margin: 0px auto; width: 960px; min-width: 960px; font-size: 12px; background: #xxx; } div.header { margin: 0 10px 10px 10px; } div.inventory { height: 50px; margin: 0; background: url(../image.png) repeat-x top left; padding: 10px 20px; font-size: 1.0em; color: #xxx; }
Tue, 2010-04-06 02:55
#1
Please post your HTML as well
Please post your HTML as well and please use <code> tags.
Tue, 2010-04-06 17:16
#2
I hope this is
I hope this is acceptable...
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html dir="ltr" xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en"> <head> <title> </title> <meta http-equiv="Content-Type" content="text/html;charset=utf8_unicode_ci" /> <meta name="" /> <base href="" /> <link rel="shortcut icon" href="" /> <link rel="stylesheet" type="text/css" href="" /> <link rel="stylesheet" type="text/css" href="" /> <meta name="description" content="" /> <meta name="keywords" content="" /> <script type="text/javascript" src=""></script> <!--[if lt IE 7]> <script defer type="text/javascript" src=""></script> <![endif]--> <script type="text/javascript"> intelli.lang = intelli.lang['en']; </script> </head> <body> <!-- main page start --> <div class="page" style=" width: 920px; font-size: 1em;"> <script type="text/javascript" src=""></script> <!-- AddThis Button END --> <!-- inventory line start --> <div class="inventory"> <!-- inventory menu start --> <ul class="inv"> <li class="active"></li> <li><a href=""></a></li> <li><a href=""></a></li> <li class=""> <a href=""></a> </li> </ul> <!-- inventory menu end --> </div> <!-- invenotory line end --> <div class="header"> <table cellpadding="0" cellspacing="0" width="100%"> <tr> <td nowrap="nowrap" width="1%"> <!-- logo start --> <div class="logo"> <a href=""> <img src="" title="" alt="" /> </a> </div> <div class="slogan" align="center"></div> <!-- logo end --> </td> <td colspan="2" align="right" style="padding-top:5px;text-align:right;"> <script type='text/javascript' src=''></script> </td> </tr> </table> </div>