Sent by IChao on 12 August 2004 19:07
Paul Vanderwerf wrote:
> I'm sure this is something maddeningly obvious and simple but...
>
> Try as I might, I can't get a space (I'd like just 1 or 2em) between the
> bottom of my main content div and the bottom of the container. I've
> tried adjusting bottom margins and padding for html, body, and div
> elements, to no avail. The bottom (where the "updated" text sits)
> remains glued to the bottom of the container window.
>
> http://abrazo.org/new/about.html
> http://abrazo.org/new/test_style.css
>
Paul, it seems to be not obvious to me, so this might be complete
nonsense ...
div#content is absolute positioned (in FF, body height is calculated to
the height of the div#header), it will stretch the element html and will
mark the end of the scrollable area - no space below it, and a
padding-bottom in body is useless.
but when we add a
<div id="thebottom"> </div>
as a very last child of div#content (after p.updated)
with a sort of an "absolute positioning glue solvent":
#thebottom{
padding-bottom: 50px;
margin-bottom: -50px;
line-height:0; /* only margin and padding shall influence the height*/
height:0;
font-size:0;
/* border: 1px solid lime; */ /* to illustrate*/
}
, the positive padding-bottom tries to establish a space below it (but
frustrates), than the negative margin-bottom shifts the div#thebottom
out of the viewport, and as a result, there will be a space in IE6Win,
FF.9Win, Opera7.54Win.
But there must be an easier approach, anyone?
A short reply if it does the trick in Safari, Omniweb, IEMac will be
appreciated.
Regards
Ingo Chao
______________________________________________________________________
css-discuss [EMAIL-REMOVED]]
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/
