114611 - [INVALID]collapsed margins give unexpected results

Status: RESOLVED INVALID

(Core :: Layout, defect)

Description

[Sean Proctor]

From Bugzilla Helper:
User-Agent: Mozilla/5.0 (Windows; U; Windows NT 5.0; en-US; rv:0.9.6+)
Gecko/20011209
BuildID:    2001120908

I've set up a few examples
http://www.psa.neu.edu/list_test/
http://www.psa.neu.edu/list_test/example2.html
http://www.psa.neu.edu/list_test/example3.html

the last one is how I would expect them to perform.  basically, if you have a
list, without setting the margin, then there is a one line margin at the top. 
the background color of this is not of the block element behind the list, but
whatever element has content.  This doesn't make sense to me.  the examples I
made are the clearest way to explain it.

Reproducible: Always
Steps to Reproduce:
visit links

Comment 1

[Boris Zbarsky [:bzbarsky]]

All looks fine to me... the <ul> has a 1-em top margin.  The margin is
transparent, so it shows the background color of the parent element of the <ul>

What do you mean by "whatever element has content"? 

Comment 2

[Sean Proctor]

It isn't the parent element though.  the parent element is a div with a
gray background, and mozilla shows a blue margin (which is from the div
which is the parent of the other div).

what I meant by "whatever element has content" is that if you put content
in the parent element, it will show that background, otherwise it will
show the background of the parent of that element. (check out
http://www.psa.neu.edu/list_test/example2.html for an example of what I
mean)

Comment 3

[Boris Zbarsky [:bzbarsky]]

Ah.  I see what you mean. This is correct; all that's going on is that vertical
margins are collapsing per the CSS spec.

So in http://www.psa.neu.edu/list_test/ the margin of the <div> (0em) and the
margin of the <ul> (1em) collapse to give a 1em top margin on the <div>.

In Example 2, margin collapsing cannot occur because there is content between
the margins.  So you see what you see.

Comment 4

[Sean Proctor]

you're absolutely right.  I'd missed the section on collapsable margins. 
Regardless of that, this behavior doesn't make sense, as one element can be
drawn in by the margin of an element inside of it, which doesn't seem to be the
purpose of collapsing the margins.  The spec is rather vague and gives its
reasoning only as collapsing margins will make the site look more like what the
designer intended.  I think for nested elements it would make more sense to
never increase the value of a margin.  for example:  if you have block A with
block B inside of it, and A has a margin of 3 and b has a margin of 5, it would
make more sense to me for the margin of A to remain 3, and the margin from B to
A to collapse to 2, rather than A to get a margin of 5 and B's margin to
collapse to 0 as they do currently.
It seems that the current behavior is conformant and any change would break
that, but I don't think the standard makes sense.

Comment 5

[Christopher Hoess (gone)]

Sending this over to Style System; perhaps Hixie or dbaron can mention this to the WG.

Comment 6

[David Baron :dbaron: (⌚️UTC-4, no longer working on Mozilla)]

Collapsing margins make sense to me, because I expect them, and I think they
make it easier to get the correct results by specifying margins without having
to use lots of adjacent sibling combinators.  Do you really think we should
change the spec?

Comment 7

[David Baron :dbaron: (⌚️UTC-4, no longer working on Mozilla)]

Oh, I see, you think the assignment of space within them should be changed. 
That assignment of space was actually only described in an errata item to the
spec (I think), although it may have found its way into CSS2 or the revised CSS1
(I don't know when it was writen).

Comment 8

[Sean Proctor]

right.  collapsing the margins makes perfect sense to me, though the way it's
done doesn't.  I've describe what I see as the most logical method for
collapsing the margins.  I've found nothing in the errata pertaining to this
topic. from the CSS1 spec: "Two or more adjoining vertical margins (i.e., with
no border, padding or content between them) are collapsed to use the maximum of
the margin values. (section 4.1)" and from the CSS2 spec: "the expression
collapsing margins means that adjoining margins (no padding or border areas
separate them) of two or more boxes (which may be next to one another or nested)
combine to form a single margin. (section 8.3.1)"
It seems pretty clear their intentions.  to me the current implimentation
doesn't make much sense.  when I say margin 0, I expect the border of the block
to touch adjacent blocks regardless of the content in my block.
unless there's some more important reason for the current design, I would the
spec should change.

Comment 9

[David Baron :dbaron: (⌚️UTC-4, no longer working on Mozilla)]

INVALID.  If you want to change the spec, please raise the issue on www-style.