"Neal" <ne**@spamrcn.com> writes:
"Haines Brown" <br****@teufel.hartford-hwp.com> wrote in message
news:87************@teufel.hartford-hwp.com... I want a centered body, 680px wide, having a red bottom margin.
The following works well in galeon, but not in IE5, where the
bottom margin steals the full width of the viewpoint. That is, the red
line stretches from one side of the screen to the other and is not
680 pixels long. Why isn't the bottom margin 680 pixels?
Put a big-daddy div nested just inside the body with the style
you set for the body. All content goes within that div. That
should work.
Well, yes, I realize that creating a div just to hold the attributes
would probably work, but for a couple reasons, I had wanted to avoid
that. When I do try it, the inner block is not centered. Here's the
code:
body {
background: #CCC;
background-image: url(../bin/bk.png);
}
#outer-block {
text-align: center;
border-bottom: solid;
border-color: #CC0000;
border-width: 4px;
margin: auto;
width: 680px;
}
#IE-hack {
margin-left: auto;
margin-right: auto;
width: 680px;
text-align: left;
}
<body>
<div id="outer-block">
<div id="IE-hack">
<h1>Test</h1>
</div>
</div>
</body>
This markup does fine on galeon, and, as you suggest, it does limit
the red border to just the 680 pixels. However, this the IE-hack block
is not centered on IE5, but is aligned left. On galeon, it is aligned
center as it should be.
I don't understand why, but the outer-block requires the margin
attribute for the IE-hack block to center.
Am I to conclude that it is impossible to use the body element to hold
the attributes here assigned to the outer-block?
--
Haines Brown
br****@hartford-hwp.com kb****@arrl.net www.hartford-hwp.com 
