Bug 110868 - Regression(r133037): Weird width:50% in tables
Summary: Regression(r133037): Weird width:50% in tables
Status: NEW
Alias: None
Product: WebKit
Classification: Unclassified
Component: Layout and Rendering (show other bugs)
Version: 528+ (Nightly build)
Hardware: All All
: P2 Major
Assignee: Arpita Bahuguna
URL:
Keywords:
Depends on:
Blocks:
 
Reported: 2013-02-26 03:51 PST by Frederico Caldeira Knabben
Modified: 2017-07-18 08:27 PDT (History)
13 users (show)

See Also:


Attachments
Test case. (1.07 KB, text/html)
2013-02-26 03:51 PST, Frederico Caldeira Knabben
no flags Details
TC Screenshot with Chrome 24 = GOOD (44.32 KB, image/png)
2013-02-28 01:33 PST, Frederico Caldeira Knabben
no flags Details
TC Screenshot with Chrome 25/26 = BAD (44.92 KB, image/png)
2013-02-28 01:34 PST, Frederico Caldeira Knabben
no flags Details
smaller test case (400 bytes, text/html)
2013-03-04 19:31 PST, Ojan Vafai
no flags Details
Patch (6.83 KB, patch)
2013-05-24 07:08 PDT, Arpita Bahuguna
no flags Details | Formatted Diff | Diff
Patch (7.07 KB, patch)
2013-05-27 02:49 PDT, Arpita Bahuguna
bfulgham: review-
Details | Formatted Diff | Diff

Note You need to log in before you can comment on or make changes to this bug.
Description Frederico Caldeira Knabben 2013-02-26 03:51:49 PST
Created attachment 190254 [details]
Test case.

Create a page with the following contents:

<div style="white-space:nowrap;float:left;outline:1px solid red">
	<table>
		<tr>
			<td style="width:200px">
				<!-- Fix 2: remove float:left (WAT!) -->
				<table style="width:100%;float:left">
					<tr>
						<td>
							<!-- Remove width:100% to trigger the issue in Chrome 24 as well -->
							<table style="width:100%">
								<tr>
									<td style="width:50%">
										Cell 1
									</td>
									<td style="width:50%">
										<div style="width:400px;outline: 1px solid blue">
											Cell 2, with a 400px DIV.
										</div>
									</td>
								</tr>
							</table>
						</td>
					</tr>
				</table>
			</td>
		</tr>
	</table>
</div>

The red DIV has been forced to be 200px wide but it has a 400 px (blue) DIV inside of it. Therefore, "Cell 1" should shrink to its very minimum, but it is matching the sice of "Cell 2".

Check the comments for two possible "fixes" :/

This issue impacts CKEditor dialogs rendering:
http://dev.ckeditor.com/ticket/10123

Confirmed with Chrome 25.0.1364.99 and Safari 6.0.2 (8536.26.17). Works well with Chrome 24.
Comment 1 Frederico Caldeira Knabben 2013-02-26 03:55:17 PST
Although we've noticed the issue in Chrome 25, if you follow the source code comments and remove that width:100%, the same issue can be confirmed with Chrome 24 as well.
Comment 2 Alexey Proskuryakov 2013-02-27 11:24:11 PST
I don't see any difference between Safari 6.0.2, current ToT, and Chrome 25 on this test case.
Comment 3 Frederico Caldeira Knabben 2013-02-28 01:33:47 PST
Created attachment 190677 [details]
TC Screenshot with Chrome 24 = GOOD
Comment 4 Frederico Caldeira Knabben 2013-02-28 01:34:23 PST
Created attachment 190678 [details]
TC Screenshot with Chrome 25/26 = BAD
Comment 5 Frederico Caldeira Knabben 2013-02-28 01:45:31 PST
(In reply to comment #2)
> I don't see any difference between Safari 6.0.2, current ToT, and Chrome 25 on this test case.

The difference is not between Safari and Chrome. As described in my original message, I've confirmed the issue in both browser. Sorry if I didn't make it clear.

The difference can be seen with Chrome 25/26 and Chrome 24. The TC works well with the older version, but not with newer ones. I'm sure the same may happen with older Safari versions, but that's not the point. The point is that it works well with WebKit 537.17 (Chrome 24) but got broken at some point after that, confirmed with WebKit 537.22 (Chrome 25).

I have attached a screenshot made with Chrome 24 and Chrome 25 that shows the difference.
Comment 6 Frederico Caldeira Knabben 2013-02-28 01:46:16 PST
Sorry for the "retina sized" screenshots :)
Comment 7 Ojan Vafai 2013-03-04 19:31:05 PST
Created attachment 191380 [details]
smaller test case

Here's a simplified testcase. I didn't verify if this was a regression, but I did verify that Chrome 26 does not match IE9 or FF19. So, I think we can call this a legitimate bug.
Comment 8 Tony Chang 2013-03-08 15:43:14 PST
I bisected the original test case to r133037.

Ojan's test case appears to fail on all versions of Chrome that I tested (back to Chrome 18).  I think it's also a bug, but not exactly the same as the original test case.
Comment 9 Arpita Bahuguna 2013-03-11 17:57:32 PDT
(In reply to comment #8)
> I bisected the original test case to r133037.
> 
> Ojan's test case appears to fail on all versions of Chrome that I tested (back to Chrome 18).  I think it's also a bug, but not exactly the same as the original test case.

Hi Tony,

This issue is indeed a regression caused  by r133037. I would readily work on this but currently i am travelling, till the 18th of march, and can only work on this issue post 18th.
If required, please feel free to revert my change else after 18th I will definitely work on a fix for the same.

Apologize for the inconvenience and the delay.
Comment 10 Robert Hogan 2013-05-19 10:33:50 PDT
Arpita: are you looking at this regression?
Comment 11 Arpita Bahuguna 2013-05-19 22:48:48 PDT
(In reply to comment #10)
> Arpita: are you looking at this regression?

Hi Robert, as a matter of fact fixing this regression had always been at the top of my agenda, but it kept getting sidelined due to some other priorities at work.

However, I definitely intend to make some time for it now! Thanks for bringing this back to my attention. :)
Comment 12 Arpita Bahuguna 2013-05-24 07:08:23 PDT
Created attachment 202816 [details]
Patch
Comment 13 Arpita Bahuguna 2013-05-27 02:49:14 PDT
Created attachment 202958 [details]
Patch
Comment 14 Brent Fulgham 2016-03-11 16:09:41 PST
Comment on attachment 202958 [details]
Patch

The patch doesn't apply against the current state of WebKit. Could you please provide an up-to-date patch for review?