Open
Bug 782695
Opened 13 years ago
Updated 3 years ago
css/table rendering error, nested element height not respected
Categories
(Core :: Layout, defect)
Tracking
()
UNCONFIRMED
People
(Reporter: mwoehlke.floss, Unassigned)
Details
Attachments
(1 file)
|
5.24 KB,
text/html
|
Details |
User Agent: Mozilla/5.0 (X11; Linux x86_64) KHTML/4.8.4 (like Gecko) Konqueror/4.8 Fedora/4.8.4-8.fc17
Steps to reproduce:
I have a document structure as follows:
<html> height=100%, overflow=hidden
<body> height=100%, overflow=hidden
<div> height=100%
<table> height=50%
<tr>
<th/> height=1.2em
</tr>
<tr><td>
<ul> height=100%, overflow=auto
...
<ul>
</td></tr>
</table>
</div>
</body>
</html>
Self-contained test-case HTML is attached.
Actual results:
List element is expanded to fit contents, ignoring requested height; no scrolling.
Expected results:
The intent is to divide the <div> into two equal panes having header rows, with scrolling contents. (Second pane is not set up, but not required to demonstrate the problem.)
Expected layout is that div height is set fixed to window height, table height set fixed to half this, th height is set to 1.2em, leaving td to fill remaining space, with ul height set fixed to said remaining size, with overflow=auto rpoviding scrolling within.
Have tested several Webkit-based browsers, all of which render this as expected.
I'd also appreciate suggestions how to achieve the same layout that work in current Firefox.
Attachment #651816 -
Attachment mime type: text/plain → text/html
Component: Untriaged → Layout
Product: Firefox → Core
|
||
Comment 1•13 years ago
|
||
You can get the same layout by setting heights on the table cells as needed (and possibly on the table rows if your cells use percentage heights).
As things stand, the layout looks correct to me: the parent of the <ul> has auto computed height, so the height of the <ul> should compute to auto per spec. Yes, WebKit violates the spec around tables in various ways....
|
Reporter | |
Comment 2•13 years ago
|
||
So... taking another look at this... I don't see how to make it work. The problem is that I have no way of specifying the height of the <td> containing the <ul>, which needs to be "100% of parent less 1.2 em".
Is there another way to achieve the desired effect?
|
|
||
Comment 3•13 years ago
|
||
calc(100% - 1.2em) should work in theory. Not sure about browser support...
|
|
Reporter | |
Comment 4•13 years ago
|
||
I'm increasingly unconvinced there isn't a bug here. If I set the <td> height to an absolute size, FF respects the size. However, I cannot get FF to change the size of the <td> by giving it a relative size. Even if I give it something silly like "1%" (and even if I set the containing <tr> to an absolute height), the <td> is sized to fit the inner <ul>, and so there is no scroll bar.
It seems like FF's cell size calculation either completely ignores the parents, or doesn't support relative sizes at all...
|
||
Updated•3 years ago
|
Severity: normal → S3
You need to log in
before you can comment on or make changes to this bug.
Description
•