| Index: LayoutTests/fast/css-intrinsic-dimensions/multicol.html
|
| diff --git a/LayoutTests/fast/css-intrinsic-dimensions/multicol.html b/LayoutTests/fast/css-intrinsic-dimensions/multicol.html
|
| new file mode 100644
|
| index 0000000000000000000000000000000000000000..84959e960412cd10d7d5ae84aaca89a4a52c2019
|
| --- /dev/null
|
| +++ b/LayoutTests/fast/css-intrinsic-dimensions/multicol.html
|
| @@ -0,0 +1,147 @@
|
| +<!DOCTYPE html>
|
| +<html>
|
| + <head>
|
| + <title>Multicol intrinsic width calculation</title>
|
| + <style>
|
| + .gap15 { -webkit-column-gap:15px; column-gap:15px; }
|
| + .mc3 { -webkit-columns:3; columns:3; }
|
| + .mc3w50 { -webkit-columns:3 50px; columns:3 50px; }
|
| + .mc3w150 { -webkit-columns:3 150px; columns:3 150px; }
|
| + .mcw50 { -webkit-columns:50px; columns:50px; }
|
| + .mcw150 { -webkit-columns:150px; columns:150px; }
|
| + .intrinsic { width:intrinsic; }
|
| + .hidden { visibility:hidden; } /* hide garbage produced from ​ characters */
|
| + </style>
|
| + </head>
|
| + <body>
|
| + <!-- min intrinsic width, non-auto column-count -->
|
| + <div style="width:1px;">
|
| + <div class="intrinsic mc3 gap15" data-expected-width="330">
|
| + <div style="width:100px; height:10px;"></div>
|
| + </div>
|
| + </div>
|
| + <!-- max intrinsic width, non-auto column-count -->
|
| + <div style="width:1000px;">
|
| + <div class="intrinsic mc3 gap15" data-expected-width="330">
|
| + <div style="width:100px; height:10px;"></div>
|
| + </div>
|
| + </div>
|
| + <!-- min intrinsic width, non-auto column-count, breakable lines -->
|
| + <div style="width:1px;">
|
| + <div class="intrinsic mc3 gap15" data-expected-width="330">
|
| + <div class="hidden"><div style="display:inline-block; width:100px; height:10px;"></div>​<div style="display:inline-block; width:100px; height:10px;"></div></div>
|
| + </div>
|
| + </div>
|
| + <!-- max intrinsic width, non-auto column-count, breakable lines -->
|
| + <div style="width:1000px;">
|
| + <div class="intrinsic mc3 gap15" data-expected-width="630">
|
| + <div class="hidden"><div style="display:inline-block; width:100px; height:10px;"></div>​<div style="display:inline-block; width:100px; height:10px;"></div></div>
|
| + </div>
|
| + </div>
|
| +
|
| + <!-- min intrinsic width, non-auto column-count and small column-width -->
|
| + <div style="width:1px;">
|
| + <div class="intrinsic mc3w50 gap15" data-expected-width="50">
|
| + <div style="width:100px; height:10px;"></div>
|
| + </div>
|
| + </div>
|
| + <!-- max intrinsic width, non-auto column-count and small column-width -->
|
| + <div style="width:1000px;">
|
| + <div class="intrinsic mc3w50 gap15" data-expected-width="330">
|
| + <div style="width:100px; height:10px;"></div>
|
| + </div>
|
| + </div>
|
| + <!-- min intrinsic width, non-auto column-count and small column-width, breakable lines -->
|
| + <div style="width:1px;">
|
| + <div class="intrinsic mc3w50 gap15" data-expected-width="50">
|
| + <div class="hidden"><div style="display:inline-block; width:100px; height:10px;"></div>​<div style="display:inline-block; width:100px; height:10px;"></div></div>
|
| + </div>
|
| + </div>
|
| + <!-- max intrinsic width, non-auto column-count and small column-width, breakable lines -->
|
| + <div style="width:1000px;">
|
| + <div class="intrinsic mc3w50 gap15" data-expected-width="630">
|
| + <div class="hidden"><div style="display:inline-block; width:100px; height:10px;"></div>​<div style="display:inline-block; width:100px; height:10px;"></div></div>
|
| + </div>
|
| + </div>
|
| +
|
| + <!-- min intrinsic width, non-auto column-count and large column-width -->
|
| + <div style="width:1px;">
|
| + <div class="intrinsic mc3w150 gap15" data-expected-width="100">
|
| + <div style="width:100px; height:10px;"></div>
|
| + </div>
|
| + </div>
|
| + <!-- max intrinsic width, non-auto column-count and large column-width -->
|
| + <div style="width:1000px;">
|
| + <div class="intrinsic mc3w150 gap15" data-expected-width="480">
|
| + <div style="width:100px; height:10px;"></div>
|
| + </div>
|
| + </div>
|
| + <!-- min intrinsic width, non-auto column-count and large column-width, breakable lines -->
|
| + <div style="width:1px;">
|
| + <div class="intrinsic mc3w150 gap15" data-expected-width="100">
|
| + <div class="hidden"><div style="display:inline-block; width:100px; height:10px;"></div>​<div style="display:inline-block; width:100px; height:10px;"></div></div>
|
| + </div>
|
| + </div>
|
| + <!-- max intrinsic width, non-auto column-count and large column-width, breakable lines -->
|
| + <div style="width:1000px;">
|
| + <div class="intrinsic mc3w150 gap15" data-expected-width="630">
|
| + <div class="hidden"><div style="display:inline-block; width:100px; height:10px;"></div>​<div style="display:inline-block; width:100px; height:10px;"></div></div>
|
| + </div>
|
| + </div>
|
| +
|
| + <!-- min intrinsic width, auto column-count and small column-width -->
|
| + <div style="width:1px;">
|
| + <div class="intrinsic mcw50 gap15" data-expected-width="50">
|
| + <div style="width:100px; height:10px;"></div>
|
| + </div>
|
| + </div>
|
| + <!-- max intrinsic width, auto column-count and small column-width -->
|
| + <div style="width:1000px;">
|
| + <div class="intrinsic mcw50 gap15" data-expected-width="100">
|
| + <div style="width:100px; height:10px;"></div>
|
| + </div>
|
| + </div>
|
| + <!-- min intrinsic width, auto column-count and small column-width, breakable lines -->
|
| + <div style="width:1px;">
|
| + <div class="intrinsic mcw50 gap15" data-expected-width="50">
|
| + <div class="hidden"><div style="display:inline-block; width:100px; height:10px;"></div>​<div style="display:inline-block; width:100px; height:10px;"></div></div>
|
| + </div>
|
| + </div>
|
| + <!-- max intrinsic width, auto column-count and small column-width, breakable lines -->
|
| + <div style="width:1000px;">
|
| + <div class="intrinsic mcw50 gap15" data-expected-width="200">
|
| + <div class="hidden"><div style="display:inline-block; width:100px; height:10px;"></div>​<div style="display:inline-block; width:100px; height:10px;"></div></div>
|
| + </div>
|
| + </div>
|
| +
|
| + <!-- min intrinsic width, auto column-count and large column-width -->
|
| + <div style="width:1px;">
|
| + <div class="intrinsic mcw150 gap15" data-expected-width="100">
|
| + <div style="width:100px; height:10px;"></div>
|
| + </div>
|
| + </div>
|
| + <!-- max intrinsic width, auto column-count and large column-width -->
|
| + <div style="width:1000px;">
|
| + <div class="intrinsic mcw150 gap15" data-expected-width="150">
|
| + <div style="width:100px; height:10px;"></div>
|
| + </div>
|
| + </div>
|
| + <!-- min intrinsic width, auto column-count and large column-width, breakable lines -->
|
| + <div style="width:1px;">
|
| + <div class="intrinsic mcw150 gap15" data-expected-width="100">
|
| + <div class="hidden"><div style="display:inline-block; width:100px; height:10px;"></div>​<div style="display:inline-block; width:100px; height:10px;"></div></div>
|
| + </div>
|
| + </div>
|
| + <!-- max intrinsic width, auto column-count and large column-width, breakable lines -->
|
| + <div style="width:1000px;">
|
| + <div class="intrinsic mcw150 gap15" data-expected-width="200">
|
| + <div class="hidden"><div style="display:inline-block; width:100px; height:10px;"></div>​<div style="display:inline-block; width:100px; height:10px;"></div></div>
|
| + </div>
|
| + </div>
|
| +
|
| + <script src="../../resources/check-layout.js"></script>
|
| + <script>
|
| + checkLayout(".intrinsic");
|
| + </script>
|
| + </body>
|
| +</html>
|
|
|