NEW 67895
REGRESSION (Safari 5.0.5-5.1): An absolute positioned block, inside a relative positioned block, in a CSS3 column, is clipped to the boundaries of the column 
https://bugs.webkit.org/show_bug.cgi?id=67895
Summary REGRESSION (Safari 5.0.5-5.1): An absolute positioned block, inside a relativ...
James Holderness
Reported 2011-09-10 13:49:59 PDT
I have an H1 with position absolute inside a DIV with position relative inside another DIV with a -webkit-column-count of 2. The H1 is positioned such that it overflows the boundaries of the outer columned DIV. I would expect the entire H1 to be visible, but it is clipped to the boundaries of the outer DIV - anything extending outside the boundaries is invisible. Removing the relative position from the inner DIV makes the H1 visible again. Removing the column-count from the outer DIV also makes the H1 visible. The attached HTML example demonstrates the problem. If it is working correctly, it should display a green block of columned text with a blue "Heading" above it. When displayed incorrectly, the blue heading is invisible. This test case works as expected in Firefox 6.0.2 (tested on OSX and Windows Vista), and Opera 11.50 (on OSX). It fails in Safari 5.1 (7534.50) on Windows Vista, and Google Chrome (13.0.782.220) on OSX. It also works in Safari 5.0.5 (6533.21.1) on OSX which suggests that it might be a regression.
Attachments
Test case (1.69 KB, text/html)
2011-09-10 13:51 PDT, James Holderness 		no flags
Details
Test case, two column layout where absolute positioned element is split (badly) between two columns (1.52 KB, text/html)
2014-03-04 06:30 PST, Stephen 		no flags
Details
Two column test case rendered in both Firefox and Chrome for comparison (47.56 KB, image/png)
2014-03-04 06:32 PST, Stephen 		no flags
Details
View All Add attachment proposed patch, testcase, etc.
James Holderness
Comment 1 2011-09-10 13:51:43 PDT
Created attachment 106982 [details] Test case
Stephen
Comment 2 2014-03-04 06:30:41 PST
Created attachment 225770 [details] Test case, two column layout where absolute positioned element is split (badly) between two columns Its worse than just being clipped, absolutely positioned elements are also split between columns.
Stephen
Comment 3 2014-03-04 06:32:00 PST
Created attachment 225771 [details] Two column test case rendered in both Firefox and Chrome for comparison Here is how this test case in rendered in both Firefox (correctly) and Chrome (incorrectly)
Stephen
Comment 4 2014-03-04 06:39:14 PST
I suggest changing the title of this bug to: Absolute positioned block inside CSS3 column is clipped to column boundaries and split between columns.
Brent Fulgham
Comment 5 2022-07-12 15:21:07 PDT
WebKit continues to fail these test cases.
Radar WebKit Bug Importer
Comment 6 2022-07-12 15:21:26 PDT
<rdar://problem/96913620>
Note You need to log in before you can comment on or make changes to this bug.