Bug 139742

Summary: display: table-cell with position: relative and top: Xpx DIFFERENT from Firefox
Product: WebKit Reporter: Jon Dufresne <jon.dufresne>
Component: Layout and RenderingAssignee: Nobody <webkit-unassigned>
Status: RESOLVED INVALID    
Severity: Normal    
Priority: P2    
Version: 528+ (Nightly build)   
Hardware: Unspecified   
OS: Unspecified   
Attachments:
Description Flags
Screenshot in WebKit
none
Screenshot in Firefox none

Jon Dufresne
Reported 2014-12-17 12:43:08 PST
I'm not sure which rendering is technically correct based on the spec. But I ran into this issue while developing and noticed a difference between Firefox and WebKit. The results from WebKit surprised me the most and is why I'm reporting this here. If this is actually a Firefox bug, please let me know and I will file the bug in the appropriate place. When an element has the CSS: display: table-cell; position: relative; top: Xpx; Where X is some value greater than 0, the element is renderd X pixels from the top. I am surprised by this as I would expect (intuitively; not based on a spec) table-cell display to override the relative positioning. That is, I'd expect the element to be rendered more like a table cell. Test document: <!doctype HTML> <head> <title>Test</title> <style> #row { display: table; } .cell { display: table-cell; position: relative; height: 100px; width: 100px; } #left { background-color: green; top: 50px; } #right { background-color: red; } </style> </head> <body> <div id="row"> <div id="left" class="cell"></div> <div id="right" class="cell"></div> </div> </body>
Attachments
Screenshot in WebKit (660 bytes, image/png)
2014-12-17 12:43 PST, Jon Dufresne 		no flags
Details
Screenshot in Firefox (535 bytes, image/png)
2014-12-17 12:43 PST, Jon Dufresne 		no flags
Details
View All Add attachment proposed patch, testcase, etc.
Jon Dufresne
Comment 1 2014-12-17 12:43:38 PST
Created attachment 243453 [details] Screenshot in WebKit
Jon Dufresne
Comment 2 2014-12-17 12:43:54 PST
Created attachment 243454 [details] Screenshot in Firefox
Jon Dufresne
Comment 3 2014-12-17 17:14:47 PST
According to the Firefox guys, WebKit is correct, Firefox is incorrect. <https://bugzilla.mozilla.org/show_bug.cgi?id=1112750> <https://bugzilla.mozilla.org/show_bug.cgi?id=35168>
Note You need to log in before you can comment on or make changes to this bug.