Files
tubestation/layout/reftests/flexbox/flexbox-intrinsic-sizing-horiz-1-ref.xhtml
Boris Chiou 32e62fc910 Bug 1322780 - Part 2: Support unprefixed min-content and max-content. r=mats,emilio
Support unprefixed min-content and max-content and treat the prefixed
version as aliases for
1. width, min-width, max-width if inline-axis is horizontal, and
2. height, min-height, max-height if inline-axis is vertical, and
3. inline-size, min-inline-size, max-inline-size, and
4. flex-basis.

Besides, update the test cases to use unprefixed max-content and
min-content.

Depends on D7535

Differential Revision: https://phabricator.services.mozilla.com/D7536
2018-12-18 18:47:37 +00:00

92 lines
3.1 KiB
HTML

<?xml version="1.0" encoding="UTF-8"?>
<!--
Any copyright is dedicated to the Public Domain.
http://creativecommons.org/publicdomain/zero/1.0/
-->
<!--
Reference case - see documentation in corresponding testcase.
This reference uses blocks where the testcase uses flexboxes.
They should be sized the same, since they're basically just text
with no special flex sizing properties in play.
-->
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<link rel="stylesheet" type="text/css" href="ahem.css" />
<style>
table {
width: 300px;
font: 10px Ahem;
margin-bottom: 2px;
border: 1px dashed black;
}
div.a { background: lightgreen; }
div.b { background: lightblue; }
<!-- helper-classes for assigning pref / min / auto-width to our divs -->
div.prefWidth {
width: max-content;
}
div.minWidth {
width: min-content;
}
div.autoWidth {
width: auto;
}
</style>
</head>
<body>
<!-- both auto width -->
<table cellpadding="0" cellspacing="0"><tr>
<td><div class="a autoWidth">aaaa aaaa aaaaa</div></td>
<td><div class="b autoWidth">bb bb b bb bb b bb b</div></td>
</tr></table>
<!-- MIXING MIN WIDTH & AUTO -->
<!-- both min width -->
<table cellpadding="0" cellspacing="0"><tr>
<td><div class="a minWidth">aaaa aaaa aaaaa</div></td>
<td><div class="b minWidth">bb bb b bb bb b bb b</div></td>
</tr></table>
<!-- min,auto -->
<table cellpadding="0" cellspacing="0"><tr>
<td><div class="a minWidth">aaaa aaaa aaaaa</div></td>
<td><div class="b autoWidth">bb bb b bb bb b bb b</div></td>
</tr></table>
<!-- auto,min -->
<table cellpadding="0" cellspacing="0"><tr>
<td><div class="a autoWidth">aaaa aaaa aaaaa</div></td>
<td><div class="b minWidth">bb bb b bb bb b bb b</div></td>
</tr></table>
<!-- MIXING PREF WIDTH & AUTO -->
<!-- both prefWidth (NOTE: makes the table larger than it wants to be -->
<table cellpadding="0" cellspacing="0"><tr>
<td><div class="a prefWidth">aaaa aaaa aaaaa</div></td>
<td><div class="b prefWidth">bb bb b bb bb b bb b</div></td>
</tr></table>
<!-- pref,auto -->
<table cellpadding="0" cellspacing="0"><tr>
<td><div class="a prefWidth">aaaa aaaa aaaaa</div></td>
<td><div class="b autoWidth">bb bb b bb bb b bb b</div></td>
</tr></table>
<!-- auto,pref -->
<table cellpadding="0" cellspacing="0"><tr>
<td><div class="a autoWidth">aaaa aaaa aaaaa</div></td>
<td><div class="b prefWidth">bb bb b bb bb b bb b</div></td>
</tr></table>
<!-- MIXING PREF WIDTH & MIN WIDTH -->
<!-- min,pref -->
<table cellpadding="0" cellspacing="0"><tr>
<td><div class="a minWidth">aaaa aaaa aaaaa</div></td>
<td><div class="b prefWidth">bb bb b bb bb b bb b</div></td>
</tr></table>
<!-- pref,min -->
<table cellpadding="0" cellspacing="0"><tr>
<td><div class="a prefWidth">aaaa aaaa aaaaa</div></td>
<td><div class="b minWidth">bb bb b bb bb b bb b</div></td>
</tr></table>
</body>
</html>