Closed
Bug 115245
Opened 23 years ago
Closed 20 years ago
when two tables placed in TD and top table has height=100%, the bottom table is hidden
Categories
(Core :: Layout: Tables, defect, P3)
Tracking
()
RESOLVED
FIXED
Future
People
(Reporter: atmjav, Unassigned)
References
Details
(Keywords: compat, Whiteboard: [awd:tbl][p3])
Attachments
(5 files)
From Bugzilla Helper:
User-Agent: Mozilla/5.0 (Windows; U; Win98; en-US; rv:0.9.6+) Gecko/20011213
BuildID: 2001121313
The sample of code below isn't viewed properly. There are two tables, blank with
white background at the top and one containing text at the bottom, placed in two
other tables. Blank table has height="100%", so in Mozilla 0.9.6 the bottom
table is hidden (unlike the other browsers).
Reproducible: Always
Steps to Reproduce:
1. Create a page with a table (m.b. width=100% height=380).
2. Place in a cell two other tables with width=100%, and set height=100% in the
first of them.
Actual Results: You can see that the second table is hidden. When you remove
height=100% both are visible.
Expected Results: In all other browsers including Netscape 6.2 and Mozilla
0.9.4 both tables are visible.
Here is sample code:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>Mozilla 0.9.6 (since 0.9.5) - bug</title>
</head>
<body bgcolor="#19BCD2">
<table align="center" border="0" width="748" cellspacing="0" cellpadding="3"
bgcolor="#036D7F" bordercolor="#036D7F">
<tr>
<td valign=top>
<table align="center" border="0" width="100%" height="380" cellspacing="0"
cellpadding="0" bgcolor="#FFFFFF">
<tr>
<td valign=top>
<!-- ~~~~~~~BUG~~~~~~~(height="100%") --><table align="center" border="0"
width="100%" height="100%" cellspacing="0" cellpadding="0" bgcolor="white">
<tr>
<td width=136 height=100> </td>
</tr>
</table>
<table align="center" border="0" width="100%" cellspacing="0" cellpadding="0">
<tr>
<td width=134 height=100 valign="top" bgcolor="#e0ffff">
yuiyututuyu fesf
e<br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br>
</td>
</tr>
</table>
</td>
</tr>
</table>
</td>
</tr>
</table>
</body>
</html>
|
||
Comment 1•23 years ago
|
||
Status: UNCONFIRMED → NEW
Ever confirmed: true
Whiteboard: [awd:tbl][p3]
|
Reporter | |
Comment 2•23 years ago
|
||
I see this bug in all latest versions.
|
||
Updated•23 years ago
|
Target Milestone: --- → mozilla1.2
|
|
Reporter | |
Comment 3•23 years ago
|
||
Unlike Mozilla, Netscape 6.2.2 displays these tables correctly.
Do you wish to leave this bug as is, or do you plan to fix this regression?
Alexander, nobody wishes to leave bugs as they are, but as you might see from a
bugzilla query for html-tables there are several other bugs (>200), the only
known way that this regression will be fixed is that you attach a patch to
this bug. If you can do this I will be happy to help to you with the testing of
the patch. So gentleman... start your engines.
this is a incremental reflow problem. On the last reflow the upper table takes
all despite the lower table. Then the accumulated blockheight is around 10000
and gets clipped by the cell, we should probably also warn/assert on this case.
the testcase is in strict mode. (IE and netscape 6.2 render samely, but mozilla
trunk does not.)
I found that if the testcase is in quirk mode, IE will render the same as
mozilla trunk.
I found that IE, mozilla and opera have different Table height algorithms.( The
tescase is in strict mode)
for example.
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<table align="center" border="1" width="100" height="300" id="1">
<tr>
<td valign=top>
<table width="100%" height="80%" bgcolor="green" id="2">
<tr>
<td width=136 height=100>Table I
</td>
</tr>
</table>
<table width="100%" id="3">
<tr>
<td width=134 height=100 valign="top" bgcolor="blue">TableII
</td>
</tr>
</table>
</td>
</tr>
</table>
table 1 has table 2 and table 3 inside it.
Table 1 has specific height value as 300.
Table 2's content min height is 100, but it has height value as 80%
Table 3 doesnot set height explicitly,but its content min height is also 100.
For IE, it will set Table 2's height as its content min height
so Table 1 height will be 300, Table 2 height will be 100, Table 3 height
will be 100.
For Opera, it will set Table 2's height as 80%x(Table 1'height)
So Table 2 height will be 240, Table 3 height will be 100, Table 1 height
will be 340.
For mozilla, it is different.
It will set Table 2's height as 240, Table 3's height as 100, but Table 1's height
is 300. ( that is why Table 3 will render partially.)
I refer to css2 table height spec, it does not give me help.
bz and dbaron, can you help me to give me a tip?
which one is better, that we will follow?
|
||
Comment 9•22 years ago
|
||
Explanations to follow...
|
|
||
Comment 10•22 years ago
|
||
I've attached a testcase that shows modified versions of the attachment from
comment 6, and the markup found in comment 8. I'll explain them in reverse order.
In comment 8, we had markup that isn't strict but claims to be, so I took it and
reworked it so that the markup and CSS conformed to strict guidelines, as
necessitated by the DOCTYPE. I also threw in another table that shows the green
table isn't 240 pixels tall, because it isn't 80% the height of the table-- it's
80% the height of the cell, which is its parent and which is a little less than
300 pixels tall. The blue table does still get cut off at the cell boundary
(marked with the dotted gray border). The height of the outer table (I renamed
it to t0) is 300 pixels, as specified via CSS (formerly via HTML). This is
correct. The sizing of the contents of the cells is correct as well. The
truncation of the blue table is also permissible under CSS2-- this would be
described by 'overflow: hidden' on the table cells. I'll get back to that in a
moment.
The reason the divs from comment 6's testcase are visible is that they overflow
the parent div, which is still 300 pixels tall. I set a 5-pixel red border on
it in my testcase to illustrate this fact. So the outer div isn't growing to
contain its children, it's just letting the overflowing parts be seen.
So, in theory, if we set the table and its cells to have 'overflow: visible' the
contents of the cells would spill out and be visible. The table wouldn't get
taller, but we'd get to see the contents. However, I tried to get this effect
and failed-- every combination I tried, like 'table, tr, td {overflow: bisible
!important', failed. That's the problem, in my opinion, and would seem to be
covered by bug 26617. I think this bug is a duplicate of that one, when you get
right down to it, but I'll leave that to the owner to decide.
|
||
Comment 11•22 years ago
|
||
mass reassign to default owner
Assignee: karnaze → table
Status: ASSIGNED → NEW
QA Contact: amar → madhur
Target Milestone: mozilla1.2alpha → ---
|
|
||
Comment 13•21 years ago
|
||
bernd, it looks like this is a case where table overflow fails... (even in a
current trunk build).
|
||
Comment 14•20 years ago
|
||
this has been fixed in standards mode by the checkin for bug 131020
Status: NEW → RESOLVED
Closed: 20 years ago
Resolution: --- → FIXED
|
|
Reporter | |
Comment 15•19 years ago
|
||
I see this bug in Fx 1.0.4 / WinXP
|
|
||
Comment 16•19 years ago
|
||
Firefox 1.0.x uses the layout engine from April 2004. Please don't bother
testing layout bugs with those builds.
You need to log in
before you can comment on or make changes to this bug.
Description
•