Bug 209681

Summary: CSS Columns child items hidden when relatively positioned
Product: WebKit Reporter: onlyforhisname
Component: New BugsAssignee: Nobody <webkit-unassigned>
Status: NEW    
Severity: Normal CC: mail, simon.fraser, webkit-bug-importer, zalan
Priority: P2 Keywords: InRadar
Version: Safari 13   
Hardware: Mac   
OS: macOS 10.14   
Attachments:
Description Flags
Shows the column bug occurring with the minimum amount of css none

onlyforhisname
Reported 2020-03-27 14:50:16 PDT
Created attachment 394760 [details] Shows the column bug occurring with the minimum amount of css Noticed in Safari Version 13.1 (14609.1.20.111.8), verified still present in Mojave r259135 (See attachment or https://codepen.io/onlyforhisname/pen/LYVMLEV) When an item contains multiple columns using column-count or column-width and the first-level items have overflow hidden, any second-level children with position relative still take up space but are not visible (unless they are in the first column). May be related to https://bugs.webkit.org/show_bug.cgi?id=207991
Attachments
Shows the column bug occurring with the minimum amount of css (17.63 KB, application/zip)
2020-03-27 14:50 PDT, onlyforhisname 		no flags
Details
View All Add attachment proposed patch, testcase, etc.
onlyforhisname
Comment 1 2020-03-27 14:56:20 PDT
As a temporary fix, I found that adding transform: translateX(0); to the main container will cause the items to show like normal
Radar WebKit Bug Importer
Comment 2 2020-03-27 16:58:02 PDT
<rdar://problem/60991112>
Damon
Comment 3 2020-07-01 09:46:44 PDT
Just adding that I also independently ran across this (Safari 13.1.1, macOS 10.15.5) with a replication here https://jsfiddle.net/dzucconi/fvxu4gc5/
Note You need to log in before you can comment on or make changes to this bug.