[Webkit-unassigned] [Bug 45111] New: Rendering bug (ie & firefox does this well but webkit not). Two-column layout table with first column nowrap and second column of width 100% breaks, if there's a row with a column with colspan=2 in it with a wide table in it. How fix?

bugzilla-daemon at webkit.org bugzilla-daemon at webkit.org
Thu Sep 2 08:49:08 PDT 2010


https://bugs.webkit.org/show_bug.cgi?id=45111

           Summary: Rendering bug (ie & firefox does this well but webkit
                    not). Two-column layout table with first column nowrap
                    and second column of width 100% breaks, if there's a
                    row with a column with colspan=2 in it with a wide
                    table in it. How fix?
           Product: WebKit
           Version: 528+ (Nightly build)
          Platform: PC
        OS/Version: Windows Vista
            Status: UNCONFIRMED
          Severity: Normal
          Priority: P2
         Component: Tables
        AssignedTo: webkit-unassigned at lists.webkit.org
        ReportedBy: mikael.trash at gmail.com


(The below is a copy of an email i sent to the webkit-help ml. I realize i'd better post it here.)

The reason I posted it is because it reflects what I understand to be an aspect of Webkit's table renderer, that makes it impossible to make two-column layouts with inlined sections with a one-column layout.
     And what's more peculiar to it, is that the way the renderer makes this impossible, is peculiar. Inlining real basic sections with a one-column layout works, but as soon as the section contains a table, the outer two-column layout's column widths mess up.

It seems to me that HTML/Webkit "should" be able to do this. It works in IE and Firefox.

What do you say?

 - 

The break is manifested as that the two-column layout gets a 50/50 width division instead of the one desired.

This is the second time in some while I run into this problem, and I found no solution as of yet, even after an extensive search for a solution.

The point with not splitting the outer table in two, is to get the same column width on the two-column layout both below and after the colspan=2.

The point with a two-column layout where the first column has nowrap and the second one width 100%, is to present form fields and alike in a consistent manner. I can't use PX or EM widths on the left column, as different browsers give different width to that column based on the width of the text.

The reason not to use DIV:s do describe these tables is because i need IE6&7 support and would want to use the same HTML and CSS for both browsers. 

Do you see any way of getting this running in webkit?


The HTML below provides an example, you'll find it currently at http://www.webdevout.net/test?015 . It works well in Firefox 3.6 and IE7 but not in Chromium nor Safari:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD XHTML 1.1 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> 
<html><head> 
<meta http-equiv="content-type" content="text/html; charset=ISO-8859-5"><style> 

.outerTable tr td { border: 1px solid red; }
.innerTable tr td { border: 1px solid green; }

</style></head>
<body>
<table class="outerTable">
<tbody>

<tr><td>hhhhh</td><td style="width: 100%;">ggggggg</td></tr>

<tr><td colspan="2"><table class="innerTable">
<tbody>
<tr><td>9</td><td>cccccccccc</td><td>dddddddddd</td><td>aaaaaaaaaaaaa</td><td>bbbbbbbbb</td></tr></tbody></table></td></tr>

<tr><td>fffffff</td><td><span class="panelVisible">eeeee</span></td></tr>

</tbody></table></body></html>

Many thanks

-- 
Configure bugmail: https://bugs.webkit.org/userprefs.cgi?tab=email
------- You are receiving this mail because: -------
You are the assignee for the bug.



More information about the webkit-unassigned mailing list