Sent by Brian Lawlor | LSNC on 1 February 2004 03:03
> >http://www.webdogs.org/blog/TestBlog/
> Hi Brian - first, you have HTML errors. All your .posted divs
> are unclosed (ain't copy and paste fun?)
What a bonehead mistake on my part. As you aptly point out,
that's what I get for third- or fourth-generation cut-n-paste,
huh? Thanks for the wake-up call.
> Now, the problem you have is this -
>
> #content {margin-bottom: 20px;}
> .blogbody {margin-bottom: 30px;}
> .posted {margin-botton: 20px;}
>
> These three are actually collapsing, leaving the largest one
> to be the actual amount of the gap (30px). Mozilla seems to
> be obeying them, IE seems not to be obeying. You'll have to
> find a way to eliminate all three if you want Mozilla to
> appear to draw the border all the way to to browser chrome.
> It is drawing the border to the end of #content, but the
> space exists outside that.
>
> You might try using top margins on .blogbody and .posted,
> some combination should give you the separation you desire
> between the elements, or use padding instead, perhaps. Then
> you can probably remove the bottm margin from #content, as well.
Holly, spot on, as usual. I dropped all the bottom margins and then used
padding on the .date element to get the separation I was looking for.
But a follow-up question, if I may: If I use .date {padding-top: 30px;}
everything is hunky dory, but if I use .date {margin-top: 30px;} I get the
same problem I had before at the bottom. This leaves me confused about the
box model, I guess, but I had been thinking that as long as the other things
(.date, .blog, .posted, yada yada yada) were within the #content div, then
the border-left of the #content would simply accommodate them. With padding,
yes -- but margins, no? How does the margin-top (with the .date) or
margin-bottom (with the .posted) end *outside* the #content div?
I'm confused on this point.
And, regardless, thanks for all the help with the real solution!
- Brian
______________________________________________________________________
css-discuss [EMAIL-REMOVED]]
http://www.css-discuss.org/mailman/listinfo/css-d
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
