Bug 279980 (embedded_div_margin)

Top & bottom margin is displayed outside wrong div

RESOLVED INVALID

Status

()

Core
Layout
RESOLVED INVALID
13 years ago
13 years ago

People

(Reporter: Bradley Erhart, Unassigned)

Tracking

({css1})

Trunk
x86
Windows XP
Points:
---

Firefox Tracking Flags

(Not tracked)

Details

Attachments

(1 attachment)

(Reporter)

Description

13 years ago
User-Agent:       Mozilla/5.0 (Windows; U; Windows NT 5.1; en-US; rv:1.7.5) Gecko/20041107 Firefox/1.0
Build Identifier: Mozilla/5.0 (Windows; U; Windows NT 5.1; en-US; rv:1.7.5) Gecko/20041107 Firefox/1.0

topic says it all

Reproducible: Always

Steps to Reproduce:
look at sourcecode


Expected Results:  
margin should be displayed inside first div

if you specify width on first div as 100% it fixes the problem for ie, if you
specify a border it fixes the problem for firefox
(Reporter)

Comment 1

13 years ago
Created attachment 172514 [details]
Example
(Reporter)

Updated

13 years ago
Alias: embedded_div_margin
Component: Layout: Block and Inline → Layout
Keywords: clean-report, css-moz, css1, qawanted
Summary: top & bottom margin is displayed outside first div → Top & bottom margin is displayed outside first-level div
This is probably invalid. 
See the css2.1 chapter on collapsing margins:
http://www.w3.org/TR/CSS21/box.html#collapsing-margins
(Reporter)

Comment 3

13 years ago
Comment on attachment 172514 [details]
Example

View the sourcecode. Top & bottom margin is not displayed in Firefox or IE. Can
be fixed in Firefox by adding a border to the outside DIV. Can be fixed in IE
by adding a 100% width to the outside DIV.
Attachment #172514 - Attachment description: sourcecode → Example
(Reporter)

Comment 4

13 years ago
Comment on attachment 172514 [details]
Example

<html>
<body>
<div style="background: #000">
<div style="background: #999; height: 125px; margin: 25px">&nbsp;</div>
</div>
</body>
</html>
Well, I can only say that it should work so according to the link I just gave
you. See the last point made there:
"
If the top and bottom margins of a box are adjoining, then it is possible for
margins to collapse through it. In this case, the position of the element
depends on its relationship with the other elements whose margins are being
collapsed.

    * If the element's margins are collapsed with its parent's top margin, the
top border edge of the box is defined to be the same as the parent's.
    * Otherwise, either the element's parent is not taking part in the margin
collapsing, or only the parent's bottom margin is involved. The position of the
element's top border edge is the same as it would have been if the element had a
non-zero top border.
"
(Reporter)

Comment 6

13 years ago
(In reply to comment #5)
> Well, I can only say that it should work so according to the link I just gave
> you. See the last point made there:
> "
> If the top and bottom margins of a box are adjoining, then it is possible for
> margins to collapse through it. In this case, the position of the element
> depends on its relationship with the other elements whose margins are being
> collapsed.
> 
>     * If the element's margins are collapsed with its parent's top margin, the
> top border edge of the box is defined to be the same as the parent's.
>     * Otherwise, either the element's parent is not taking part in the margin
> collapsing, or only the parent's bottom margin is involved. The position of the
> element's top border edge is the same as it would have been if the element had a
> non-zero top border.
> "
> 

It's still not obvious to me as to why this happening. The information you gave
me isn't clear enough to describe if this is what it's referring to.
Summary: Top & bottom margin is displayed outside first-level div → Top & bottom margin is displayed outside wrong div
(Reporter)

Comment 7

13 years ago
(In reply to comment #5)
> Well, I can only say that it should work so according to the link I just gave
> you. See the last point made there:
> "
> If the top and bottom margins of a box are adjoining, then it is possible for
> margins to collapse through it. In this case, the position of the element
> depends on its relationship with the other elements whose margins are being
> collapsed.
> 
>     * If the element's margins are collapsed with its parent's top margin, the
> top border edge of the box is defined to be the same as the parent's.
>     * Otherwise, either the element's parent is not taking part in the margin
> collapsing, or only the parent's bottom margin is involved. The position of the
> element's top border edge is the same as it would have been if the element had a
> non-zero top border.
> "
> 

Add a border to the first DIV & watch what happens in IE. It does not say
anything about that happening.
Status: UNCONFIRMED → RESOLVED
Last Resolved: 13 years ago
Keywords: clean-report, css-moz, qawanted
Resolution: --- → INVALID
*** Bug 287982 has been marked as a duplicate of this bug. ***
You need to log in before you can comment on or make changes to this bug.