<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 - Elements in a flex box do not stretch properly."
href="https://bugs.webkit.org/show_bug.cgi?id=163382">163382</a>
</td>
</tr>
<tr>
<th>Summary</th>
<td>Elements in a flex box do not stretch properly.
</td>
</tr>
<tr>
<th>Classification</th>
<td>Unclassified
</td>
</tr>
<tr>
<th>Product</th>
<td>WebKit
</td>
</tr>
<tr>
<th>Version</th>
<td>Safari Technology Preview
</td>
</tr>
<tr>
<th>Hardware</th>
<td>Macintosh
</td>
</tr>
<tr>
<th>OS</th>
<td>macOS 10.12
</td>
</tr>
<tr>
<th>Status</th>
<td>NEW
</td>
</tr>
<tr>
<th>Severity</th>
<td>Major
</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>lewis.wkbugs@dorigo.co
</td>
</tr></table>
<p>
<div>
<pre>In Safari Technology Preview, and the Webkit Nightly Build, on element with `display: flex; flex-wrap: wrap;` and an explicit height, the child do not stretch to fit the height of the container, as would be expected with `align-items: stretch; align-content: stretch`. Rather, they stretch to the height of the tallest sibling on the same row.
Safari 10.0, Firefox 49.0.1, and Chrome 54 all exhibit the correct, expected behaviour.
An example of this can be found here: <a href="http://codepen.io/anon/pen/PGaZyP">http://codepen.io/anon/pen/PGaZyP</a></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>