The motivation of this patch is that this test would fail after we fix bug 1481876, and it already fails in Chrome and Safari, which is worth fixing now. This patch maintains the intent of the sub-test that validates fractional `fr` units. However, the flex factor sum, which used to be less than one, now becomes greater than one. Therefore, I have distilled this sub-test into a web-platform test in the next part to exercise the code path and the behavior described in spec 12.7.1.2 [1]. [1] https://drafts.csswg.org/css-grid-2/#algo-find-fr-size Differential Revision: https://phabricator.services.mozilla.com/D240553
82 lines
1.9 KiB
HTML
82 lines
1.9 KiB
HTML
<!DOCTYPE HTML>
|
|
<!--
|
|
Any copyright is dedicated to the Public Domain.
|
|
http://creativecommons.org/publicdomain/zero/1.0/
|
|
-->
|
|
<html><head>
|
|
<meta charset="utf-8">
|
|
<title>CSS Grid Test: Testing track flex max-sizing</title>
|
|
<link rel="author" title="Mats Palmgren" href="https://bugzilla.mozilla.org/show_bug.cgi?id=1151212">
|
|
<style type="text/css">
|
|
body,html { color:black; background:white; font-size:8px; line-height:10px; padding:0; margin:0; }
|
|
|
|
.grid {
|
|
display: grid;
|
|
grid-auto-columns: 40px;
|
|
border: 3px dashed blue;
|
|
width: 720px;
|
|
}
|
|
|
|
.c1 { grid-row: 1 / span 2; }
|
|
.c2 { grid-row: 2 / span 3; }
|
|
.c3 { grid-row: 3 / span 1; }
|
|
|
|
span {
|
|
background: gray;
|
|
padding: 1px 3px;
|
|
margin: 1px 5px;
|
|
min-height: 5px;
|
|
justify-self: flex-start;
|
|
}
|
|
|
|
</style>
|
|
</body>
|
|
<head>
|
|
|
|
<div class="grid" style="grid-template-rows: 3px 6px 9px 6px 3px;">
|
|
<span class="c1"></span>
|
|
<span class="c2"></span>
|
|
<span class="c3"></span>
|
|
</div>
|
|
|
|
<div class="grid" style="grid-template-rows: 2.25px 4.5px 6.75px 4.5px 2.25px;">
|
|
<span class="c1"></span>
|
|
<span class="c2"></span>
|
|
<span class="c3"></span>
|
|
</div>
|
|
|
|
<div class="grid" style="grid-template-rows: 9px 18px 27px 18px 9px;">
|
|
<span class="c1"></span>
|
|
<span class="c2"></span>
|
|
<span class="c3"></span>
|
|
</div>
|
|
|
|
<div class="grid" style="grid-template-rows: 9px 18px 27px 18px 9px;">
|
|
<span class="c1"></span>
|
|
<span class="c1"></span>
|
|
<span class="c1"></span>
|
|
<span class="c2"></span>
|
|
<span class="c3"></span>
|
|
</div>
|
|
|
|
<div class="grid" style="grid-template-rows: 18px 36px 54px 36px 18px;">
|
|
<span class="c1"></span>
|
|
<span class="c2"></span>
|
|
<span class="c3"></span>
|
|
</div>
|
|
|
|
<div class="grid" style="grid-template-rows: 18px 36px 54px 36px 18px;">
|
|
<span class="c1"></span>
|
|
<span class="c2"></span>
|
|
<span class="c3"></span>
|
|
</div>
|
|
|
|
<div class="grid" style="grid-template-rows: 18px 36px 54px 36px 18px;">
|
|
<span class="c1"></span>
|
|
<span class="c2"></span>
|
|
<span class="c3"></span>
|
|
</div>
|
|
|
|
</body>
|
|
</html>
|