222059 - Margin property is rendered incorrectly if contained in a block-level element with no padding

Status: RESOLVED INVALID

(Core :: CSS Parsing and Computation, defect)

Description

[Michael Favia]

User-Agent:       Mozilla/5.0 (Windows; U; Windows NT 5.1; en-US; rv:1.6a) Gecko/20031002 Firebird/0.7+
Build Identifier: Mozilla/5.0 (Windows; U; Windows NT 5.1; en-US; rv:1.6a) Gecko/20031002 Firebird/0.7+

In the page at http://www.insitesinc.com/problem.html I have placed a detailed
and thourough explanation of the problem. Simple stated however Mozilla isnt
correctly rendering the top and bottom margin properties when a block-level
elements resides inside another block-level element. Unless i specify a non-zero
padding value for the ancestor (container) the margins are incorrectly
calculated and displayed on the margin-top and margin-bottom.

Reproducible: Always

Steps to Reproduce:
1. Open browser.
2. Goto URL (http://www.insitesinc.com/problem.html).
3. Gasp in horror.
Actual Results:  
Displayed the child blocklevel elements without top or bottom margins where the
content meets the ancestor element.

Expected Results:  
Made space above and below the child elements when obeying the margin property.

Please feel free to contact me for further information or to correct my
misunderstandings.

Comment 1

[Mats Palmgren (inactive)]

The page renders as expected - adjoining margins collapse:
http://www.w3.org/TR/CSS21/box.html#collapsing-margins

-> INVALID

Comment 2

[Michael Favia]

I have read the new expanded 2.1 Working Draft (was reading 2REC) and still feel
that there is a misimplementation. Could you please point out the specific part
of the collapsing margins section that you are referring to. Sorry to be a
bother but i think it is an important issue.

Comment 3

[David Baron :dbaron:]

http://www.w3.org/TR/CSS21/visudet.html#q19 - 3d paragraph of section 10.6.3.

Comment 4

[Michael Favia]

At http://www.w3.org/TR/CSS21/box.html#collapsed-through
Spec Says:
"If the top and bottom margins of a box are adjacent..."
Does Spec Mean:
"If the top and bottom margins of two boxes are adjacent..."

I took the use of the singular article 'a' to mean the one and same box, where
it seems that they mean between two boxes. Odd difference but important one I think.

If they mean the later then your approach makes perfect sense at least as far as
the spec is concerned. 

As an aside however do you happen to know why the margin of a normal flow
blocklevel element should collapse through its parents content border on the top
and bottom? I dont see any justifiable reason for this but i hope one exists.

Regardless it seems that this is not a bug for Mozilla but maybe a broader
question about the spec. Thank you for the time you spent and sorry for the
trouble please feel free to close this bug but i would appreciate a response if
you know why margins "collapse through" parents content edge. It seems to me
like this shouldnt be possible.

For future use if i close a bug do you still receive the last msg i add as a
comment? Thanks again.

Comment 5

[Mats Palmgren (inactive)]

You mean the fifth bullet?  I think the singular 'a' is really intended there,
it's the edge case for an empty block:
<div style="margin:1em 0"></div>

Margin collapsing involving two blocks is described in the first bullet.

Yes, we recieve all messages, even when the bug is resolved.

Comment 6

[Gérard Talbot]

*** Bug 321841 has been marked as a duplicate of this bug. ***