<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 - [css-flex] Flex container baseline wrongly uses content-box bottom to synthesize baselines"
href="https://bugs.webkit.org/show_bug.cgi?id=165062">165062</a>
</td>
</tr>
<tr>
<th>Summary</th>
<td>[css-flex] Flex container baseline wrongly uses content-box bottom to synthesize baselines
</td>
</tr>
<tr>
<th>Classification</th>
<td>Unclassified
</td>
</tr>
<tr>
<th>Product</th>
<td>WebKit
</td>
</tr>
<tr>
<th>Version</th>
<td>WebKit Nightly Build
</td>
</tr>
<tr>
<th>Hardware</th>
<td>Unspecified
</td>
</tr>
<tr>
<th>OS</th>
<td>Unspecified
</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>Layout and Rendering
</td>
</tr>
<tr>
<th>Assignee</th>
<td>webkit-unassigned@lists.webkit.org
</td>
</tr>
<tr>
<th>Reporter</th>
<td>jfernandez@igalia.com
</td>
</tr>
<tr>
<th>CC</th>
<td>simon.fraser@apple.com
</td>
</tr></table>
<p>
<div>
<pre>Created <span class=""><a href="attachment.cgi?id=295409" name="attach_295409" title="Test case to reproduce the issue.">attachment 295409</a> <a href="attachment.cgi?id=295409&action=edit" title="Test case to reproduce the issue.">[details]</a></span>
Test case to reproduce the issue.
According the the last draft version of the Flexible Box specification:
<a href="https://drafts.csswg.org/css-flexbox/#flex-baselines">https://drafts.csswg.org/css-flexbox/#flex-baselines</a>
"if the flex container has at least one flex item, the flex container’s first/last main-axis baseline set is generated from the alignment baseline of the first/last flex item. (If that item has no alignment baseline parallel to the flex container’s main axis, then one is first synthesized from its border edges.)"
The CSS WG has agreed as well that we should do the same for orthogonal flex items:
<a href="https://github.com/w3c/csswg-drafts/issues/373">https://github.com/w3c/csswg-drafts/issues/373</a>
<a href="https://lists.w3.org/Archives/Public/www-style/2016Sep/0000.html">https://lists.w3.org/Archives/Public/www-style/2016Sep/0000.html</a>
Also, while I couldn't find it in the specs, the CSS WG has agreed that an empty Flexbox containers should synthesize its baseline using its border-box bottom edge:
<a href="https://github.com/w3c/csswg-drafts/issues/439">https://github.com/w3c/csswg-drafts/issues/439</a>
The attached test cases prove that current implementation doesn't follow the spec.</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>