Page Center - Slightly Off [Archive]

DawgMom

01-13-2010, 04:52 AM

Okay, because of a conflict with Sothink Menu Builder I cannot use the container or wrapper tag the way I normally would on my CSS. Instead, I've done this:

* { margin:0; padding:0; }

body {
margin: 0 auto;
width: 1000px;
text-align: center;
background-color: #e0d7e6;
height: 100%;
font-family: Arial, Helvetica, sans-serif;
font-size: 12px;
color: #000;
letter-spacing: normal;
vertical-align: top;
word-spacing: normal;
white-space: normal;
line-height: normal;
padding: 0px;
background-image: url(../images/shared/gifs/bacgrnd.gif);
background-repeat: repeat-x;
}
#wrapper {
text-align: left;
position: relative;
z-index: 0;
}

And the HTML:

</head>
<body><div id="wrapper">

webpage content

</div></body>

And, it works well, except the page is off center (to the right) by a couple of pixels. It's in all browsers. Does anyone have a fix? Thanks in advance.

simcomedia

01-23-2010, 01:22 AM

Move the width: 1000px into the #wrapper element. You don't need the text-align: center either since you have:

margin: 0;
padding: 0;

which accomplishes the same thing.

wrapper should look something like this:

#wrapper {
width: 1000px;
margin: auto;
padding: 0;
min-height: 100%;
background-color: #fff;
}

Also, what's the problem with the Sothink Menu Builder? The only thing I have a problem with using it is it always adds a <p> tag I have to remove since I don't want the extra spacing it creates.