189840 - [quirks]CSS percent height on a div inside a TD causes it to collapse

Status: RESOLVED FIXED

(Core :: Layout: Tables, defect)

Description

[Tony Gorman]

User-Agent:       Mozilla/5.0 (Windows; U; Windows NT 5.1; en-US; rv:1.3b) Gecko/20030119
Build Identifier: Mozilla/5.0 (Windows; U; Windows NT 5.1; en-US; rv:1.3b) Gecko/20030119

The example shown demonstrates a single celled table, containing a relatively
positioned DIV, with its height set to 100%. In side this relatively positioned
DIV is an absolutely positioned DIV.

If viewed in Mozilla 1.2x or earlier, Netscape 7.01 or earlier or indeed ie5+,
the cells renders to the heuight if its content and the AHREF is bottom aligned.

Recent builds of Mozilla collapse all content where height:100% is present in
the Relative Div.

This is a major blocker for a new ecommerce site I am working on for a big
Retailer in Europe. The site is fully Gecko friendly and will carry a
recommended browser of Mozilla, Netscape 7 or IE5+.  The site is almost ready to
go live and this extract of code is used in numerous places throughout the site.

The idea is to allow the AHREF to bottom align to a table cell while the rest of
the content is top aligned. The reason this method has been employed rather than
a pure CSS approach is to make it work in IE5 (non-negotiable) and becuase of
the CMS we use.





Reproducible: Always

Steps to Reproduce:

Comment 1

[Doron Rosenberg (IBM)]

regression, not a blocker.

Comment 2

[Tony Gorman]

Checked build 20030404 and it was foobar as well

Comment 3

[Ruslan Ismailov]

Sorry, what do you want to obtain from this height: 100%? If you want to made
div size equal to viewport, that you should add style="height: 100%" to html,
body and table tags. If you want to made this div height equal to blah-blah
distance, than you should remove height. Meaning of height: 100% is simple --
value height of parent node (TD in this case). div's could overflow the parent
nodes, so height: 100% for div should lead to <td> colapse.

Comment 4

[Tony Gorman]

The purpose of applying height:100% to the relative DIV inside a TD is to
provide a positioning context for a nested abs pos div inside the relative div,
that is the full height of the cell. 

the TD is actually one of three tds in a row. Each TD has differing amounts of
text in it, but I need my AHREF to be in the same place (bottom:0px) in each TD,
thus the relative DIV.

I know there are ways to achieve the same effect without using a table - but as
I said earlier, I am constrained  by several factors to usaing this method.

Comment 5

[Tony Gorman]

After backtracking as much as possible, I know this regression appened somewhere
between 20021209 and 20021225.

Cant find binaries anywhere for that period :(

Comment 6

[Boris Zbarsky [:bzbarsky]]

The behavior changed between 2002-12-17-21 and 2002-12-18-21.  I bet the checkin
for bug 172896 is what changed it....

The behavior is correct (and unchanged) in standards mode where we just ignore
the 100%, per spec, but in quirks mode we apparently try to do something with it
and it screws up.

Note that the "position:relative" is not needed either.  I'll attach a smaller
testcase.

The bug is purely a table reflow bug, looks like....

Comment 7

[Boris Zbarsky [:bzbarsky]]

Attachment: smaller testcase

Comment 8

[Robert O'Callahan (:roc) (email my personal email if necessary)]

I don't think we can hold 1.3beta for this, but bernd, it would be GREAT if we
could get a fix for 1.3final. I could take a look at this myself, too.

Comment 9

[Bernd]

Attachment: hack

Comment 10

[Bernd]

Attachment: patch

Comment 11

[Bernd]

Attachment: patch

Comment 12

[Robert O'Callahan (:roc) (email my personal email if necessary)]

Comment on attachment 112630 [details] [diff] [review]
patch

Sounds good to me. Since karnaze's mostly gone, I'll take it upon myself to
issue a rubber-stamp review.

Comment 13

[Bernd]

I runned the regression tests, the two only visible differences are:
http://lxr.mozilla.org/seamonkey/source/layout/html/tests/table/bugs/bug149275-2.html
http://lxr.mozilla.org/seamonkey/source/layout/html/tests/table/bugs/bug32205-2.html

In both cases it fixes wrong behaviour.

Comment 14

[Bernd]

Comment on attachment 112630 [details] [diff] [review]
patch

This patch fixes a layout regression (probably dbarons patch to remove the
NS_BLOCKWRAPSIZE only made the bug obvious). I runned the regression tests.
Having divs in unconstrained tables is quite common and a percentage height on
the div can ruin the layout.

Comment 15

[Asa Dotzler [:asa]]

Comment on attachment 112630 [details] [diff] [review]
patch

a=asa (on behalf of drivers) for checkin to 1.3beta.

Comment 16

[Tony Gorman]

Thanks for the quick turnaround. Always great to see Mozilla at work :)

Comment 17

[Bernd]

fix checked in