Forum Moderators: not2easy
/* Layout CSS Refs */
#wrapper {
background-color: #FFF;
color: #000;
_width: 774px;
min-width: 774px;
max-width: 896px;
margin: 0 auto;
}
#wrapper .roundtop {
background: url(images/bkg_header_left.gif) no-repeat top left;
height: 15px;
width: 100%;
}
#wrapper #content {
background-color: #FFF;
border-left: 3px solid #CCC;
border-right: 3px solid #CCC;
width: 100%;
height: 100%;
}
#wrapper .roundbottom {
background: url(images/bkg_bottom_left.gif) no-repeat top left;
height: 15px;
width: 100%;
}
img.corner {
width: 15px;
height: 15px;
border: none;
display: block!important;
float: right;
}
/* Layout CSS Refs */
/* Header CSS refs */
#header { margin:0; width: 100%; }
#header #logo { background: url(images/logo.gif) no-repeat left top; width: 154px; height: 65px; text-indent: -999em; margin-left: 7px;}
/* Shopping Tools CSS Refs */
#toplinkswrap { float: right; }
#toplinkswrap ul { list-style-type: none; margin:0; padding:0 }
#toplinkswrap ul li { display:inline; padding: 0 0.4em 0 0.4em; margin-top: 100em; background: #fff url(images/bkg_toplinkdiv.gif) no-repeat right top; font-size:small; _font-size: x-small; }
#toplinkswrap ul li a:link,
#toplinkswrap ul li a:visited,
#toplinkswrap ul li a:hover,
#toplinkswrap ul li a:active { padding:0 0.4em 0 0.4em; color:#656565; font-weight:normal; }
#toplinkswrap ul li#tlhelp a { font-weight:bold; }
#toplinkswrap ul li#trolley { background-image: none; }
/* Trolley CSS Refs */
#trolleyitems, #trolleyprice { color:#309a30!important }
#trolleylink {
background: transparent url(images/icon_trolley.gif) no-repeat right top!important;
font-weight:bold!important;
padding-left:.3em;
padding-right:2.3em!important;
color:#309a30!important;
}
/* END: Trolley CSS Refs */
/* END: Shopping Tools CSS Refs */
/* Search CSS Refs */
#searchwrap {
float: right;
clear:both;
width: 43em;
background: #ec2e2c url(images/bkg_search.gif) no-repeat left top;
padding: .3em 0 .3em 0;
font-size: small;
}
form#sb { margin:0; padding:0; text-align:right; }
#fssearch { color:#fff; margin-left:3em; float:left; }
#searchheader { font-weight:bold; }
#atoztext { display:inline;padding:0 .7em 0 20px; }
#atoztext a:link, #atoztext a:visited, #atoztext a:hover, #atoztext a:active { background-color:#ec2e2c; color:#fff; }
#btnsearch { vertical-align: top }
input#search { border:1px solid #C00; padding:0 .3em 0 .3em; margin:0 .6em}
/* END: Search CSS Refs */
/* END: Header css refs */
and I have my HTML:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Untitled Document</title>
<link href="argos.css" rel="stylesheet" type="text/css" />
</head>
<body>
<div id="wrapper">
<div class="roundtop">
<img src="images/bkg_header_right.gif" alt="" width="15" height="15" class="corner" />
</div>
<div id="content">
<div id="header">
<div id="logo">SEO Text</div>
<div id="toplinkswrap">
<ul>
<li id="tlhome"><a href="#" title="home">Home</a></li>
<li id="tllogreg"><a href="#" title="login or register">Login/Register</a></li>
<li id="tlstorelocator"><a href="#" title="store locator">Store Locator</a></li>
<li id="tlhelp"><a href="#" title="help">Help</a></li>
<li id="trolley"><a href="#" id="trolleylink" title="trolley">Trolley</a> <span id="trolleyitems">99 Items = </span><span id="trolleyprice">£1000.00</span></li>
</ul>
</div>
</div id="header">
</div>
<div class="roundbottom">
<img src="images/bkg_bottom_right.gif" alt="" width="15" height="15" class="corner" />
</div>
</div>
</body>
</html>
For some reason I get this weird appearance in Firefox, weird padding around the main content area mainly, could someone help me out please?
