mozilla
/
gecko-dev
зеркало из https://github.com/mozilla/gecko-dev.git
1
0
Форкнуть 0
Код Задачи Пакеты Проекты Релизы Вики Активность

Bug 1322780 - Part 5: Adjust reftests to be fitted into 600x600. r=dholbert 

If the size is larger than 600x600, we cannot test all the rendering
results, and it seems there is a bug related the inactive windows,
https://github.com/web-platform-tests/wpt/issues/13563, which may causes
that the scroll bar has different color.

Differential Revision: https://phabricator.services.mozilla.com/D15055

--HG--
extra : moz-landing-system : lando
This commit is contained in:
Boris Chiou 2018-12-20 07:00:15 +00:00
Родитель 12c3c11f23
Коммит 0605a25f5e
16 изменённых файлов: 282 добавлений и 228 удалений
Показать статистику Скачать Patch файл Скачать Diff файл Показать все файлы Свернуть все файлы

3
layout/reftests/w3c-css/submitted/sizing/block-size-with-min-or-max-content-1-ref.html
Просмотреть файл

@ -6,6 +6,9 @@
<link rel="stylesheet" type="text/css" href="support/ahem.css">
<meta name="flags" content="ahem">
<style>
html,body {
margin: 0;
}
.container {
width: max-content;
height: 50px;

3
layout/reftests/w3c-css/submitted/sizing/block-size-with-min-or-max-content-1a.html
Просмотреть файл

@ -10,6 +10,9 @@
<link rel="stylesheet" type="text/css" href="support/ahem.css">
<link rel="stylesheet" type="text/css" href="support/min-content-max-content.css">
<style>
html,body {
margin: 0;
}
.container {
width: max-content;
height: 50px;

3
layout/reftests/w3c-css/submitted/sizing/block-size-with-min-or-max-content-1b.html
Просмотреть файл

@ -10,6 +10,9 @@
<link rel="stylesheet" type="text/css" href="support/ahem.css">
<link rel="stylesheet" type="text/css" href="support/min-content-max-content.css">
<style>
html,body {
margin: 0;
}
.container {
inline-size: max-content;
height: 50px;

3
layout/reftests/w3c-css/submitted/sizing/block-size-with-min-or-max-content-table-1-ref.html
Просмотреть файл

@ -5,6 +5,9 @@
<meta charset="utf-8">
<link rel="author" title="Boris Chiou" href="mailto:boris.chiou@gmail.com">
<style>
html,body {
margin: 0;
}
table {
border: 2px solid black;
}

4
layout/reftests/w3c-css/submitted/sizing/block-size-with-min-or-max-content-table-1a.html
Просмотреть файл

@ -8,6 +8,10 @@
<link rel="match" href="block-size-with-min-or-max-content-table-1-ref.html">
<link rel="stylesheet" type="text/css" href="support/min-content-max-content.css">
<style>
html,body {
margin: 0;
}
table {
border: 2px solid black;
}

4
layout/reftests/w3c-css/submitted/sizing/block-size-with-min-or-max-content-table-1b.html
Просмотреть файл

@ -8,6 +8,10 @@
<link rel="match" href="block-size-with-min-or-max-content-table-1-ref.html">
<link rel="stylesheet" type="text/css" href="support/min-content-max-content.css">
<style>
html,body {
margin: 0;
}
table {
border: 2px solid black;
}

63
layout/reftests/w3c-css/submitted/sizing/hori-block-size-small-or-larger-than-container-with-min-or-max-content-1-ref.html
Просмотреть файл

@ -9,11 +9,14 @@
<link rel="stylesheet" type="text/css" href="support/ahem.css">
<meta name="flags" content="ahem">
<style>
html, body {
margin: 0;
}
.container {
width: 120px;
height: 200px;
border: 2px solid blue;
padding: 5px;
display: inline-block;
vertical-align: top;
}
@ -24,8 +27,8 @@
display: inline-block;
font-family: Ahem;
font-size: 15px;
line-height: 21px;
font-size: 10px;
line-height: 15px;
}
.too-small {
@ -33,39 +36,43 @@
}
.too-big {
height: 150px;
height: 120px;
}
</style>
</head>
<body>
<div class="container">
<div>height: min-content<br>on this box.</div>
<div>height: max-content<br>on this box.</div>
<div>
<div class="container">
<div>height: min-content<br>on this box.</div>
<div>height: max-content<br>on this box.</div>
</div>
<div class="container">
<div class="too-small">min-height: min-content<br>on this box.</div>
<div class="too-small">min-height: max-content<br>on this box.</div>
</div>
<div class="container">
<div class="too-big">max-height: min-content<br>on this box.</div>
<div class="too-big">max-height: max-content<br>on this box.</div>
</div>
</div>
<div class="container">
<div class="too-small">min-height: min-content<br>on this box.</div>
<div class="too-small">min-height: max-content<br>on this box.</div>
</div>
<div>
<div class="container">
<div>block: min-content<br>on this box.</div>
<div>block: max-content<br>on this box.</div>
</div>
<div class="container">
<div class="too-big">max-height: min-content<br>on this box.</div>
<div class="too-big">max-height: max-content<br>on this box.</div>
</div>
<div class="container">
<div class="too-small">min-block: min-content<br>on this box.</div>
<div class="too-small">min-block: max-content<br>on this box.</div>
</div>
<div class="container">
<div>block: min-content<br>on this box.</div>
<div>block: max-content<br>on this box.</div>
</div>
<div class="container">
<div class="too-small">min-block: min-content<br>on this box.</div>
<div class="too-small">min-block: max-content<br>on this box.</div>
</div>
<div class="container">
<div class="too-big">max-block: min-content<br>on this box.</div>
<div class="too-big">max-block: max-content<br>on this box.</div>
<div class="container">
<div class="too-big">max-block: min-content<br>on this box.</div>
<div class="too-big">max-block: max-content<br>on this box.</div>
</div>
</div>
</body>
</html>

88
layout/reftests/w3c-css/submitted/sizing/hori-block-size-small-or-larger-than-container-with-min-or-max-content-1.html
Просмотреть файл

@ -12,23 +12,25 @@
<link rel="stylesheet" type="text/css" href="support/ahem.css">
<link rel="stylesheet" type="text/css" href="support/min-content-max-content.css">
<style>
html, body {
margin: 0;
}
.container {
width: 120px;
height: 200px;
border: 2px solid blue;
padding: 5px;
display: inline-block;
vertical-align: top;
}
.container > * {
border: 2px solid lime;
padding: 5px;
display: inline-block;
font-family: Ahem;
font-size: 15px;
line-height: 21px;
font-size: 10px;
line-height: 15px;
}
.too-small {
@ -36,54 +38,58 @@
}
.too-big {
height: 150px;
height: 120px;
}
</style>
</head>
<body>
<div class="container">
<div class="height-min-content">height: min-content<br>on this box.</div>
<div class="height-max-content">height: max-content<br>on this box.</div>
</div>
<div class="container">
<div class="too-small min-height-min-content">
min-height: min-content<br>on this box.
<div>
<div class="container">
<div class="height-min-content">height: min-content<br>on this box.</div>
<div class="height-max-content">height: max-content<br>on this box.</div>
</div>
<div class="too-small min-height-max-content">
min-height: max-content<br>on this box.
<div class="container">
<div class="too-small min-height-min-content">
min-height: min-content<br>on this box.
</div>
<div class="too-small min-height-max-content">
min-height: max-content<br>on this box.
</div>
</div>
<div class="container">
<div class="too-big max-height-min-content">
max-height: min-content<br>on this box.
</div>
<div class="too-big max-height-max-content">
max-height: max-content<br>on this box.
</div>
</div>
</div>
<div class="container">
<div class="too-big max-height-min-content">
max-height: min-content<br>on this box.
<div>
<div class="container">
<div class="block-min-content">block: min-content<br>on this box.</div>
<div class="block-max-content">block: max-content<br>on this box.</div>
</div>
<div class="too-big max-height-max-content">
max-height: max-content<br>on this box.
</div>
</div>
<div class="container">
<div class="block-min-content">block: min-content<br>on this box.</div>
<div class="block-max-content">block: max-content<br>on this box.</div>
</div>
<div class="container">
<div class="too-small min-block-min-content">
min-block: min-content<br>on this box.
</div>
<div class="too-small min-block-max-content">
min-block: max-content<br>on this box.
</div>
</div>
<div class="container">
<div class="too-small min-block-min-content">
min-block: min-content<br>on this box.
</div>
<div class="too-small min-block-max-content">
min-block: max-content<br>on this box.
</div>
</div>
<div class="container">
<div class="too-big max-block-min-content">
max-block: min-content<br>on this box.
</div>
<div class="too-big max-block-max-content">
max-block: max-content<br>on this box.
<div class="container">
<div class="too-big max-block-min-content">
max-block: min-content<br>on this box.
</div>
<div class="too-big max-block-max-content">
max-block: max-content<br>on this box.
</div>
</div>
</div>
</body>

31
layout/reftests/w3c-css/submitted/sizing/hori-block-size-small-or-larger-than-container-with-min-or-max-content-2-ref.html
Просмотреть файл

@ -9,22 +9,23 @@
<link rel="stylesheet" type="text/css" href="support/ahem.css">
<meta name="flags" content="ahem">
<style>
html,body {
margin: 0;
}
.outer * {
border: 2px solid lime;
padding: 5px;
font-size: 15px;
line-height: 1;
}
.container {
width: 160px;
width: 80px;
border-color: blue;
display: inline-block;
vertical-align: top;
font-family: Ahem;
font-size: 15px;
line-height: 21px;
font-size: 8px;
line-height: 13px;
}
.too-small {
@ -32,7 +33,7 @@
}
.too-big {
height: 150px;
height: 100px;
}
</style>
</head>
@ -47,8 +48,8 @@
<div class="too-small">10px<br>container: min-content.</div>
</div>
<div class="container">
<div class="too-big">150px<br>container: min-content.</div>
<div class="too-big">150px<br>container: min-content.</div>
<div class="too-big">100px<br>container: min-content.</div>
<div class="too-big">100px<br>container: min-content.</div>
</div>
<div class="container">
@ -60,8 +61,8 @@
<div class="too-small">10px<br>container: max-content.</div>
</div>
<div class="container">
<div class="too-big">150px<br>container: max-content.</div>
<div class="too-big">150px<br>container: max-content.</div>
<div class="too-big">100px<br>container: max-content.</div>
<div class="too-big">100px<br>container: max-content.</div>
</div>
</div>
@ -81,12 +82,12 @@
</div>
<div class="container">
<div class="too-big">150px<br>container max-size: min-content.</div>
<div class="too-big">150px<br>container max-size: min-content.</div>
<div class="too-big">100px<br>container max-size: min-content.</div>
<div class="too-big">100px<br>container max-size: min-content.</div>
</div>
<div class="container">
<div class="too-big">150px<br>container max-size: max-content.</div>
<div class="too-big">150px<br>container max-size: max-content.</div>
<div class="too-big">100px<br>container max-size: max-content.</div>
<div class="too-big">100px<br>container max-size: max-content.</div>
</div>
</div>
</body>

31
layout/reftests/w3c-css/submitted/sizing/hori-block-size-small-or-larger-than-container-with-min-or-max-content-2a.html
Просмотреть файл

@ -12,22 +12,23 @@
<link rel="stylesheet" type="text/css" href="support/ahem.css">
<link rel="stylesheet" type="text/css" href="support/min-content-max-content.css">
<style>
html,body {
margin: 0;
}
.outer * {
border: 2px solid lime;
padding: 5px;
font-size: 15px;
line-height: 1;
}
.container {
width: 160px;
width: 80px;
border-color: blue;
display: inline-block;
vertical-align: top;
font-family: Ahem;
font-size: 15px;
line-height: 21px;
font-size: 8px;
line-height: 13px;
}
.too-small {
@ -35,7 +36,7 @@
}
.too-big {
height: 150px;
height: 100px;
}
</style>
</head>
@ -50,8 +51,8 @@
<div class="too-small">10px<br>container: min-content.</div>
</div>
<div class="container height-min-content">
<div class="too-big">150px<br>container: min-content.</div>
<div class="too-big">150px<br>container: min-content.</div>
<div class="too-big">100px<br>container: min-content.</div>
<div class="too-big">100px<br>container: min-content.</div>
</div>
<div class="container height-max-content">
@ -63,8 +64,8 @@
<div class="too-small">10px<br>container: max-content.</div>
</div>
<div class="container height-max-content">
<div class="too-big">150px<br>container: max-content.</div>
<div class="too-big">150px<br>container: max-content.</div>
<div class="too-big">100px<br>container: max-content.</div>
<div class="too-big">100px<br>container: max-content.</div>
</div>
</div>
@ -84,12 +85,12 @@
</div>
<div class="container max-height-min-content">
<div class="too-big">150px<br>container max-size: min-content.</div>
<div class="too-big">150px<br>container max-size: min-content.</div>
<div class="too-big">100px<br>container max-size: min-content.</div>
<div class="too-big">100px<br>container max-size: min-content.</div>
</div>
<div class="container max-height-max-content">
<div class="too-big">150px<br>container max-size: max-content.</div>
<div class="too-big">150px<br>container max-size: max-content.</div>
<div class="too-big">100px<br>container max-size: max-content.</div>
<div class="too-big">100px<br>container max-size: max-content.</div>
</div>
</div>
</body>

31
layout/reftests/w3c-css/submitted/sizing/hori-block-size-small-or-larger-than-container-with-min-or-max-content-2b.html
Просмотреть файл

@ -12,22 +12,23 @@
<link rel="stylesheet" type="text/css" href="support/ahem.css">
<link rel="stylesheet" type="text/css" href="support/min-content-max-content.css">
<style>
html,body {
margin: 0;
}
.outer * {
border: 2px solid lime;
padding: 5px;
font-size: 15px;
line-height: 1;
}
.container {
width: 160px;
width: 80px;
border-color: blue;
display: inline-block;
vertical-align: top;
font-family: Ahem;
font-size: 15px;
line-height: 21px;
font-size: 8px;
line-height: 13px;
}
.too-small {
@ -35,7 +36,7 @@
}
.too-big {
block-size: 150px;
block-size: 100px;
}
</style>
</head>
@ -50,8 +51,8 @@
<div class="too-small">10px<br>container: min-content.</div>
</div>
<div class="container block-min-content">
<div class="too-big">150px<br>container: min-content.</div>
<div class="too-big">150px<br>container: min-content.</div>
<div class="too-big">100px<br>container: min-content.</div>
<div class="too-big">100px<br>container: min-content.</div>
</div>
<div class="container block-max-content">
@ -63,8 +64,8 @@
<div class="too-small">10px<br>container: max-content.</div>
</div>
<div class="container block-max-content">
<div class="too-big">150px<br>container: max-content.</div>
<div class="too-big">150px<br>container: max-content.</div>
<div class="too-big">100px<br>container: max-content.</div>
<div class="too-big">100px<br>container: max-content.</div>
</div>
</div>
@ -84,12 +85,12 @@
</div>
<div class="container max-block-min-content">
<div class="too-big">150px<br>container max-size: min-content.</div>
<div class="too-big">150px<br>container max-size: min-content.</div>
<div class="too-big">100px<br>container max-size: min-content.</div>
<div class="too-big">100px<br>container max-size: min-content.</div>
</div>
<div class="container max-block-max-content">
<div class="too-big">150px<br>container max-size: max-content.</div>
<div class="too-big">150px<br>container max-size: max-content.</div>
<div class="too-big">100px<br>container max-size: max-content.</div>
<div class="too-big">100px<br>container max-size: max-content.</div>
</div>
</div>
</body>

64
layout/reftests/w3c-css/submitted/sizing/vert-block-size-small-or-larger-than-container-with-min-or-max-content-1-ref.html
Просмотреть файл

@ -9,23 +9,25 @@
<link rel="stylesheet" type="text/css" href="support/ahem.css">
<meta name="flags" content="ahem">
<style>
html,body {
margin: 0;
}
.container {
width: 200px;
height: 120px;
border-color: blue;
border: 2px solid blue;
padding: 5px;
writing-mode: vertical-lr;
}
.container > * {
border: 2px solid lime;
padding: 5px;
font-size: 15px;
font-family: Ahem;
font-size: 15px;
line-height: 21px;
font-size: 10px;
line-height: 15px;
}
.too-small {
@ -33,39 +35,43 @@
}
.too-big {
width: 150px;
width: 120px;
}
</style>
</head>
<body>
<div class="container">
<div>width: min-content<br>on this box.</div>
<div>width: max-content<br>on this box.</div>
<div style="display: inline-block;">
<div class="container">
<div>width: min-content<br>on this box.</div>
<div>width: max-content<br>on this box.</div>
</div>
<div class="container">
<div class="too-small">min-width: min-content<br>on this box.</div>
<div class="too-small">min-width: max-content<br>on this box.</div>
</div>
<div class="container">
<div class="too-big">max-width: min-content<br>on this box.</div>
<div class="too-big">max-width: max-content<br>on this box.</div>
</div>
</div>
<div class="container">
<div class="too-small">min-width: min-content<br>on this box.</div>
<div class="too-small">min-width: max-content<br>on this box.</div>
</div>
<div style="display: inline-block;">
<div class="container">
<div>block: min-content<br>on this box.</div>
<div>block: max-content<br>on this box.</div>
</div>
<div class="container">
<div class="too-big">max-width: min-content<br>on this box.</div>
<div class="too-big">max-width: max-content<br>on this box.</div>
</div>
<div class="container">
<div class="too-small">min-block: min-content<br>on this box.</div>
<div class="too-small">min-block: max-content<br>on this box.</div>
</div>
<div class="container">
<div>block: min-content<br>on this box.</div>
<div>block: max-content<br>on this box.</div>
</div>
<div class="container">
<div class="too-small">min-block: min-content<br>on this box.</div>
<div class="too-small">min-block: max-content<br>on this box.</div>
</div>
<div class="container">
<div class="too-big">max-block: min-content<br>on this box.</div>
<div class="too-big">max-block: max-content<br>on this box.</div>
<div class="container">
<div class="too-big">max-block: min-content<br>on this box.</div>
<div class="too-big">max-block: max-content<br>on this box.</div>
</div>
</div>
</body>
</html>

90
layout/reftests/w3c-css/submitted/sizing/vert-block-size-small-or-larger-than-container-with-min-or-max-content-1.html
Просмотреть файл

@ -12,22 +12,24 @@
<link rel="stylesheet" type="text/css" href="support/ahem.css">
<link rel="stylesheet" type="text/css" href="support/min-content-max-content.css">
<style>
html,body {
margin: 0;
}
.container {
width: 200px;
height: 120px;
border: 2px solid blue;
padding: 5px;
writing-mode: vertical-lr;
}
.container > * {
border: 2px solid lime;
padding: 5px;
font-size: 15px;
font-family: Ahem;
font-size: 15px;
line-height: 21px;
font-size: 10px;
line-height: 15px;
}
.too-small {
@ -35,56 +37,60 @@
}
.too-big {
width: 150px;
width: 120px;
}
</style>
</head>
<body>
<div class="container">
<div class="width-min-content">width: min-content<br>on this box.</div>
<div class="width-max-content">width: max-content<br>on this box.</div>
</div>
<div class="container">
<div class="too-small min-width-min-content">
min-width: min-content<br>on this box.
<div style="display: inline-block;">
<div class="container">
<div class="width-min-content">width: min-content<br>on this box.</div>
<div class="width-max-content">width: max-content<br>on this box.</div>
</div>
<div class="too-small min-width-max-content">
min-width: max-content<br>on this box.
<div class="container">
<div class="too-small min-width-min-content">
min-width: min-content<br>on this box.
</div>
<div class="too-small min-width-max-content">
min-width: max-content<br>on this box.
</div>
</div>
<div class="container">
<div class="too-big max-width-min-content">
max-width: min-content<br>on this box.
</div>
<div class="too-big max-width-max-content">
max-width: max-content<br>on this box.
</div>
</div>
</div>
<div class="container">
<div class="too-big max-width-min-content">
max-width: min-content<br>on this box.
<div style="display: inline-block;">
<div class="container">
<div class="block-min-content">block: min-content<br>on this box.</div>
<div class="block-max-content">block: max-content<br>on this box.</div>
</div>
<div class="too-big max-width-max-content">
max-width: max-content<br>on this box.
</div>
</div>
<div class="container">
<div class="block-min-content">block: min-content<br>on this box.</div>
<div class="block-max-content">block: max-content<br>on this box.</div>
</div>
<div class="container">
<div class="too-small min-block-min-content">
min-block: min-content<br>on this box.
</div>
<div class="too-small min-block-max-content">
min-block: max-content<br>on this box.
</div>
</div>
<div class="container">
<div class="too-big max-block-min-content">
max-block: min-content<br>on this box.
<div class="container">
<div class="too-small min-block-min-content">
min-block: min-content<br>on this box.
</div>
<div class="too-small min-block-max-content">
min-block: max-content<br>on this box.
</div>
</div>
<div class="too-big max-block-max-content">
max-block: max-content<br>on this box.
<div class="container">
<div class="too-big max-block-min-content">
max-block: min-content<br>on this box.
</div>
<div class="too-big max-block-max-content">
max-block: max-content<br>on this box.
</div>
</div>
</div>
</body>

28
layout/reftests/w3c-css/submitted/sizing/vert-block-size-small-or-larger-than-container-with-min-or-max-content-2-ref.html
Просмотреть файл

@ -9,26 +9,28 @@
<link rel="stylesheet" type="text/css" href="support/ahem.css">
<meta name="flags" content="ahem">
<style>
html,body {
margin: 0;
}
.outer {
writing-mode: vertical-lr;
display: inline-block;
}
.outer * {
border: 2px solid lime;
padding: 5px;
font-size: 15px;
line-height: 1;
display: inline-block;
}
.container {
height: 160px;
height: 80px;
border-color: blue;
vertical-align: bottom;
font-family: Ahem;
font-size: 15px;
line-height: 21px;
font-size: 8px;
line-height: 13px;
}
.too-small {
@ -36,7 +38,7 @@
}
.too-big {
width: 150px;
width: 100px;
}
</style>
</head>
@ -64,8 +66,8 @@
<div class="too-small">10px<br>container: max-content.</div>
</div>
<div class="container">
<div class="too-big">150px<br>container: max-content.</div>
<div class="too-big">150px<br>container: max-content.</div>
<div class="too-big">100px<br>container: max-content.</div>
<div class="too-big">100px<br>container: max-content.</div>
</div>
</div>
@ -86,13 +88,13 @@
</div>
<div class="container">
<div class="too-big">150px<br>container max-size: min-content.</div>
<div class="too-big">150px<br>container max-size: min-content.</div>
<div class="too-big">100px<br>container max-size: min-content.</div>
<div class="too-big">100px<br>container max-size: min-content.</div>
</div>
<div class="container">
<div class="too-big">150px<br>container max-size: max-content.</div>
<div class="too-big">150px<br>container max-size: max-content.</div>
<div class="too-big">100px<br>container max-size: max-content.</div>
<div class="too-big">100px<br>container max-size: max-content.</div>
</div>
</div>
</body>

32
layout/reftests/w3c-css/submitted/sizing/vert-block-size-small-or-larger-than-container-with-min-or-max-content-2a.html
Просмотреть файл

@ -12,26 +12,28 @@
<link rel="stylesheet" type="text/css" href="support/ahem.css">
<link rel="stylesheet" type="text/css" href="support/min-content-max-content.css">
<style>
html,body {
margin: 0;
}
.outer {
writing-mode: vertical-lr;
display: inline-block;
}
.outer * {
border: 2px solid lime;
padding: 5px;
font-size: 15px;
line-height: 1;
display: inline-block;
}
.container {
height: 160px;
height: 80px;
border-color: blue;
vertical-align: bottom;
font-family: Ahem;
font-size: 15px;
line-height: 21px;
font-size: 8px;
line-height: 13px;
}
.too-small {
@ -39,7 +41,7 @@
}
.too-big {
width: 150px;
width: 100px;
}
</style>
</head>
@ -54,8 +56,8 @@
<div class="too-small">10px<br>container: min-content.</div>
</div>
<div class="container width-min-content">
<div class="too-big">150px<br>container: min-content.</div>
<div class="too-big">150px<br>container: min-content.</div>
<div class="too-big">100px<br>container: min-content.</div>
<div class="too-big">100px<br>container: min-content.</div>
</div>
<div class="container width-max-content">
@ -67,8 +69,8 @@
<div class="too-small">10px<br>container: max-content.</div>
</div>
<div class="container width-max-content">
<div class="too-big">150px<br>container: max-content.</div>
<div class="too-big">150px<br>container: max-content.</div>
<div class="too-big">100px<br>container: max-content.</div>
<div class="too-big">100px<br>container: max-content.</div>
</div>
</div>
@ -89,13 +91,13 @@
</div>
<div class="container max-width-min-content">
<div class="too-big">150px<br>container max-size: min-content.</div>
<div class="too-big">150px<br>container max-size: min-content.</div>
<div class="too-big">100px<br>container max-size: min-content.</div>
<div class="too-big">100px<br>container max-size: min-content.</div>
</div>
<div class="container max-width-max-content">
<div class="too-big">150px<br>container max-size: max-content.</div>
<div class="too-big">150px<br>container max-size: max-content.</div>
<div class="too-big">100px<br>container max-size: max-content.</div>
<div class="too-big">100px<br>container max-size: max-content.</div>
</div>
</div>
</body>

32
layout/reftests/w3c-css/submitted/sizing/vert-block-size-small-or-larger-than-container-with-min-or-max-content-2b.html
Просмотреть файл

@ -12,26 +12,28 @@
<link rel="stylesheet" type="text/css" href="support/ahem.css">
<link rel="stylesheet" type="text/css" href="support/min-content-max-content.css">
<style>
html,body {
margin: 0;
}
.outer {
writing-mode: vertical-lr;
display: inline-block;
}
.outer * {
border: 2px solid lime;
padding: 5px;
font-size: 15px;
line-height: 1;
display: inline-block;
}
.container {
height: 160px;
height: 80px;
border-color: blue;
vertical-align: bottom;
font-family: Ahem;
font-size: 15px;
line-height: 21px;
font-size: 8px;
line-height: 13px;
}
.too-small {
@ -39,7 +41,7 @@
}
.too-big {
block-size: 150px;
block-size: 100px;
}
</style>
</head>
@ -54,8 +56,8 @@
<div class="too-small">10px<br>container: min-content.</div>
</div>
<div class="container block-min-content">
<div class="too-big">150px<br>container: min-content.</div>
<div class="too-big">150px<br>container: min-content.</div>
<div class="too-big">100px<br>container: min-content.</div>
<div class="too-big">100px<br>container: min-content.</div>
</div>
<div class="container block-max-content">
@ -67,8 +69,8 @@
<div class="too-small">10px<br>container: max-content.</div>
</div>
<div class="container block-max-content">
<div class="too-big">150px<br>container: max-content.</div>
<div class="too-big">150px<br>container: max-content.</div>
<div class="too-big">100px<br>container: max-content.</div>
<div class="too-big">100px<br>container: max-content.</div>
</div>
</div>
@ -89,13 +91,13 @@
</div>
<div class="container max-block-min-content">
<div class="too-big">150px<br>container max-size: min-content.</div>
<div class="too-big">150px<br>container max-size: min-content.</div>
<div class="too-big">100px<br>container max-size: min-content.</div>
<div class="too-big">100px<br>container max-size: min-content.</div>
</div>
<div class="container max-block-max-content">
<div class="too-big">150px<br>container max-size: max-content.</div>
<div class="too-big">150px<br>container max-size: max-content.</div>
<div class="too-big">100px<br>container max-size: max-content.</div>
<div class="too-big">100px<br>container max-size: max-content.</div>
</div>
</div>
</body>