<html>
<head>
<base href="https://bugs.webkit.org/" />
</head>
<body><table border="1" cellspacing="0" cellpadding="8">
<tr>
<th>Bug ID</th>
<td><a class="bz_bug_link
bz_status_NEW "
title="NEW - CSS3 columns - invisible elements in non-first column"
href="https://bugs.webkit.org/show_bug.cgi?id=152920">152920</a>
</td>
</tr>
<tr>
<th>Summary</th>
<td>CSS3 columns - invisible elements in non-first column
</td>
</tr>
<tr>
<th>Classification</th>
<td>Unclassified
</td>
</tr>
<tr>
<th>Product</th>
<td>WebKit
</td>
</tr>
<tr>
<th>Version</th>
<td>Other
</td>
</tr>
<tr>
<th>Hardware</th>
<td>All
</td>
</tr>
<tr>
<th>OS</th>
<td>All
</td>
</tr>
<tr>
<th>Status</th>
<td>NEW
</td>
</tr>
<tr>
<th>Severity</th>
<td>Normal
</td>
</tr>
<tr>
<th>Priority</th>
<td>P2
</td>
</tr>
<tr>
<th>Component</th>
<td>CSS
</td>
</tr>
<tr>
<th>Assignee</th>
<td>webkit-unassigned@lists.webkit.org
</td>
</tr>
<tr>
<th>Reporter</th>
<td>simmo.saan@gmail.com
</td>
</tr></table>
<p>
<div>
<pre>I have a bootstrap page in which I make use of CSS3 columns: <a href="https://sim642.github.io/FLL-scorer/">https://sim642.github.io/FLL-scorer/</a>. These panels contain bootstrap radio button groups.
When viewing this page on a wide enough screen to cause it to activate the multi-column layout, the button groups turn invisible but still exist in inspector. When forcing a single column layout they show up as intended. On iOS Safari I noticed them being broken a bit differently: some of the panel content would show up fully, some would be invisible, even the text.
The problem is that elements seem to randomly turn invisible in columns which are not the first.</pre>
</div>
</p>
<hr>
<span>You are receiving this mail because:</span>
<ul>
<li>You are the assignee for the bug.</li>
</ul>
</body>
</html>