The problem:
You've set the margin on the body to be 100px all the way around. That's
fine, BUT, you then absolutely position "c1" at left: 150px; which is
relative to the body element; meaning it will be positioned 150 pixels from
the left inner-edge of the browser window - which is 50 pixels more than the
margin set on the body. It would be position relative to the #wrapper div,
which is set to position: relative; BUT you did not put the wrapper div in
your HTML, so it is not being utilized. To make it work with out changing
much adjust the left value on #cl to be 100px, or adjust the margin on your
body to be 150px. Pick your poison.
#c1 {
border: 6px solid #A46B1C;
font-size: 0.9em;
padding: 16px;
position: absolute;
top: 100px;
left: 150px; /* positions left edge appear 50 pixels too far */
width: 320px;
background-color: #F1EBE4;
}
Change to:
#c1 {
border: 6px solid #A46B1C;
font-size: 0.9em;
padding: 16px;
position: absolute;
top: 100px;
left: 100px; /* 100px is the same as the body's margin */
width: 320px;
background-color: #F1EBE4;
}
There are better ways of centering layouts than what you have going on. I'd
suggest Googleing for something like "centering layout + CSS"
The page in general is poorly put constructed, and does not validate. You
are going to have a lot of cross-browser problems. I suggest you take a
look at some of the two column layout techniques on the CSS-D Wiki.
CSS-D Wiki: Two Column Layouts
http://css-discuss.incutio.com/?page=TwoColumnLayouts
Your validation results should be addressed:
http://validator.w3.org/check?verbose=1&uri=http%3A//www.koumbite.com/index1
Good luck.
On 9/16/05 4:43 PM, "M Moore-Racine" <[EMAIL PROTECTED]> wrote:
> Can anyone please tell me how to center a 2-cols css layout inside the
> wrapper. Somehow, the left margin is larger than the right margin. I would
> like it to be equal to the right margin, and keep the layout centered in the
> wrapper. In case you need to look at the page in order to tell me, here is the
> url: http://www.koumbite.com/index1
>
> Thanks for your help.
______________________________________________________________________
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
