234964 - {inc}Height not reculated correctly when form changes

Status: RESOLVED FIXED

(Core :: Layout: Tables, defect)

Description

[Jing Lim]

User-Agent:       
Build Identifier: Mozilla/5.0 (Windows; U; Windows NT 5.0; en-US; rv:1.6) Gecko/20040113

Try this:

<form style="height:100%">
<table height=100% bgcolor=yellow>
<tr><td onclick="this.innerHTML='<br><br>'">Click here
<tr height=100%><td><textarea style="height:100%"></textarea>
<tr><td>Bottom
</table>
</form>

When you click on 'click here', the textarea isn't resized, so now the form
occupies more than 100% height. However, when you resize the window a bit,
everything then gets calculated correctly.

Reproducible: Always
Steps to Reproduce:
1. Display the html above
2. Click on the 'Click here' text.
3.

Actual Results:  
The textarea isn't resized, the "Bottom" text moves down.

Expected Results:  
The textarea should shrink, and the whole form occupies full window height.


When you change 'form' to 'div', everything works fine. Must be something to
do with the form tag.

Comment 1

[Boris Zbarsky [:bzbarsky]]

> Must be something to do with the form tag.

In particular, the fact that it has margins... If you remove those, the behavior
is that same as for <div>.

This is a block incremental layout issue.

Comment 2

[Jason Barnabe (np)]

Attachment: testcase

Next time, can you attach a file demonstrating the bug instead of posting it as
a comment? It makes it easier for everyone. Thanks.

Comment 3

[Jason Barnabe (np)]

Confirming on Mozilla/5.0 (Windows; U; Windows NT 5.1; en-US; rv:1.8a3)
Gecko/20040904 Firefox/0.9.1+

Comment 4

[Darin Fisher]

Any chance this bug might be fixed for Gecko 1.8 ?

Comment 5

[Boris Zbarsky [:bzbarsky]]

roc's the margin-meister...

Comment 6

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

This may in fact be a table bug.

Comment 7

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

Attachment: reduced testcase without margins

Yes, it is a table bug. This testcase doesn't use margins. Click and the table
will increase its height beyond the CSS specified height. If you shrink the
window until a vertical scrollbar appears, the table will revert to the correct
height.

It looks like a combination of
-- A table with CSS specified height
-- A 100%-height row containing a 100%-height DIV
-- Changing the height of another row

Comment 8

[Darin Fisher]

nominating for firefox 1.1 :-)

Comment 9

[Bernd]

I think I have seen this before, I believe thats a structural problem with incr.
reflow on rows
https://bugzilla.mozilla.org/show_bug.cgi?id=242981#c6 

Comment 10

[kcoleman]

I'm working on an app that will have a lot of usage. It works well in IE but
this is one of the blocking problems in FF. Would be great to have this resolved
in 1.1!

Comment 11

[Steve England [:stevee]]

Behaviour of test cases doesn't seem to have changed between:
- Mozilla/5.0 (Windows; U; Windows NT 5.0; en-US; rv:1.9a1) Gecko/2006120606 Minefield/3.0a (pre-reflow branch)
- Mozilla/5.0 (Windows; U; Windows NT 5.0; en-US; rv:1.9a1) Gecko/2006120804 Minefield/3.0a1 (post-reflow branch)

Comment 12

[Boris Zbarsky [:bzbarsky]]

David, you've been in this code recently... any idea what's up here?

Comment 13

[Mike Schroepfer]

nominating as we've been getting feedback from webapp devs that this is a common issue for them.

Comment 14

[Boris Zbarsky [:bzbarsky]]

Actually, this got fixed by the checkin for bug 381507.

Comment 15

[Boris Zbarsky [:bzbarsky]]

I added the tests to reftest.