mirror of
https://github.com/LadybirdBrowser/ladybird.git
synced 2024-11-21 23:20:20 +00:00
Tests: Re-import tests that used ahem.css
This causes 36 new subtests to pass locally. :^) Unfortunately at least one of these is flaky when it's able to load the font file, apparently because we don't wait for the font and its stylesheet to actually load before the tests run.
This commit is contained in:
Sam Atkins
Andreas Kling
parent
f2407cd511
commit
8f21513902
Notes:
github-actions[bot]
2024-11-06 19:04:36 +00:00
Author: https://github.com/AtkinsSJ Commit: https://github.com/LadybirdBrowser/ladybird/commit/8f21513902b Pull-request: https://github.com/LadybirdBrowser/ladybird/pull/2198
15 changed files with 756 additions and 53 deletions
|
|
@ -52,3 +52,6 @@ Text/input/wpt-import/html/infrastructure/safe-passing-of-structured-data/struct
|
|||
Text/input/wpt-import/html/infrastructure/safe-passing-of-structured-data/resources/echo-iframe.html
|
||||
Text/input/wpt-import/html/infrastructure/safe-passing-of-structured-data/resources/iframe-resizable-arraybuffer-helper.html
|
||||
Text/input/wpt-import/html/infrastructure/safe-passing-of-structured-data/resources/post-parent-type-error.html
|
||||
|
||||
; Flaky, apparently due to font loading
|
||||
Text/input/wpt-import/css/css-flexbox/flex-item-compressible-001.html
|
||||
|
|
|
|||
|
|
@ -6,27 +6,27 @@ Rerun
|
|||
|
||||
Found 40 tests
|
||||
|
||||
8 Pass
|
||||
32 Fail
|
||||
23 Pass
|
||||
17 Fail
|
||||
Details
|
||||
Result Test Name MessagePass Test getting grid-template-columns and grid-template-rows set through CSS for element 'gridWithFixedElement' : grid-template-columns = '7px 11px', grid-template-rows = '17px 2px'
|
||||
Fail Test getting grid-template-columns and grid-template-rows set through CSS for element 'gridWithPercentElement' : grid-template-columns = '400px 800px', grid-template-rows = '150px 450px'
|
||||
Pass Test getting grid-template-columns and grid-template-rows set through CSS for element 'gridWithPercentElement' : grid-template-columns = '400px 800px', grid-template-rows = '150px 450px'
|
||||
Fail Test getting grid-template-columns and grid-template-rows set through CSS for element 'gridWithPercentWithoutSize' : grid-template-columns = '3.5px 7px', grid-template-rows = '4px 12px'
|
||||
Fail Test getting grid-template-columns and grid-template-rows set through CSS for element 'gridWithAutoElement' : grid-template-columns = '0px 17px', grid-template-rows = '0px 3px'
|
||||
Fail Test getting grid-template-columns and grid-template-rows set through CSS for element 'gridWithEMElement' : grid-template-columns = '100px 120px', grid-template-rows = '150px 170px'
|
||||
Fail Test getting grid-template-columns and grid-template-rows set through CSS for element 'gridWithThreeItems' : grid-template-columns = '15px 0px 100px', grid-template-rows = '120px 18px 0px'
|
||||
Pass Test getting grid-template-columns and grid-template-rows set through CSS for element 'gridWithAutoElement' : grid-template-columns = '0px 17px', grid-template-rows = '0px 3px'
|
||||
Pass Test getting grid-template-columns and grid-template-rows set through CSS for element 'gridWithEMElement' : grid-template-columns = '100px 120px', grid-template-rows = '150px 170px'
|
||||
Pass Test getting grid-template-columns and grid-template-rows set through CSS for element 'gridWithThreeItems' : grid-template-columns = '15px 0px 100px', grid-template-rows = '120px 18px 0px'
|
||||
Fail Test getting grid-template-columns and grid-template-rows set through CSS for element 'gridWithFitContentAndFitAvailable' : grid-template-columns = 'none', grid-template-rows = 'none'
|
||||
Fail Test getting grid-template-columns and grid-template-rows set through CSS for element 'gridWithMinMaxContent' : grid-template-columns = '0px 0px', grid-template-rows = '0px 0px'
|
||||
Fail Test getting grid-template-columns and grid-template-rows set through CSS for element 'gridWithMinMaxContentWithChildrenElement' : grid-template-columns = '7px 17px', grid-template-rows = '16px 3px'
|
||||
Fail Test getting grid-template-columns and grid-template-rows set through CSS for element 'gridWithMinMaxAndFixed' : grid-template-columns = '240px 15px', grid-template-rows = '120px 210px'
|
||||
Fail Test getting grid-template-columns and grid-template-rows set through CSS for element 'gridWithMinMaxAndMinMaxContent' : grid-template-columns = '240px 15px', grid-template-rows = '120px 210px'
|
||||
Fail Test getting grid-template-columns and grid-template-rows set through CSS for element 'gridWithFractionFraction' : grid-template-columns = '320px 480px', grid-template-rows = '225px 375px'
|
||||
Fail Test getting grid-template-columns and grid-template-rows set through CSS for element 'gridWithFractionMinMax' : grid-template-columns = '45px 755px', grid-template-rows = '586px 14px'
|
||||
Fail Test getting grid-template-columns and grid-template-rows set through CSS for element 'gridWithCalcCalc' : grid-template-columns = '200px 100px', grid-template-rows = '150px 75px'
|
||||
Fail Test getting grid-template-columns and grid-template-rows set through CSS for element 'gridWithCalcAndFixed' : grid-template-columns = '400px 80px', grid-template-rows = '88px 150px'
|
||||
Fail Test getting grid-template-columns and grid-template-rows set through CSS for element 'gridWithCalcAndMinMax' : grid-template-columns = '190px 80px', grid-template-rows = '150px 53px'
|
||||
Fail Test getting grid-template-columns and grid-template-rows set through CSS for element 'gridWithCalcInsideMinMax' : grid-template-columns = '400px 120px', grid-template-rows = '150px 175px'
|
||||
Fail Test getting grid-template-columns and grid-template-rows set through CSS for element 'gridWithAutoInsideMinMax' : grid-template-columns = '0px 30px', grid-template-rows = '132px 60px'
|
||||
Pass Test getting grid-template-columns and grid-template-rows set through CSS for element 'gridWithMinMaxContent' : grid-template-columns = '0px 0px', grid-template-rows = '0px 0px'
|
||||
Pass Test getting grid-template-columns and grid-template-rows set through CSS for element 'gridWithMinMaxContentWithChildrenElement' : grid-template-columns = '7px 17px', grid-template-rows = '16px 3px'
|
||||
Pass Test getting grid-template-columns and grid-template-rows set through CSS for element 'gridWithMinMaxAndFixed' : grid-template-columns = '240px 15px', grid-template-rows = '120px 210px'
|
||||
Pass Test getting grid-template-columns and grid-template-rows set through CSS for element 'gridWithMinMaxAndMinMaxContent' : grid-template-columns = '240px 15px', grid-template-rows = '120px 210px'
|
||||
Pass Test getting grid-template-columns and grid-template-rows set through CSS for element 'gridWithFractionFraction' : grid-template-columns = '320px 480px', grid-template-rows = '225px 375px'
|
||||
Pass Test getting grid-template-columns and grid-template-rows set through CSS for element 'gridWithFractionMinMax' : grid-template-columns = '45px 755px', grid-template-rows = '586px 14px'
|
||||
Pass Test getting grid-template-columns and grid-template-rows set through CSS for element 'gridWithCalcCalc' : grid-template-columns = '200px 100px', grid-template-rows = '150px 75px'
|
||||
Pass Test getting grid-template-columns and grid-template-rows set through CSS for element 'gridWithCalcAndFixed' : grid-template-columns = '400px 80px', grid-template-rows = '88px 150px'
|
||||
Pass Test getting grid-template-columns and grid-template-rows set through CSS for element 'gridWithCalcAndMinMax' : grid-template-columns = '190px 80px', grid-template-rows = '150px 53px'
|
||||
Pass Test getting grid-template-columns and grid-template-rows set through CSS for element 'gridWithCalcInsideMinMax' : grid-template-columns = '400px 120px', grid-template-rows = '150px 175px'
|
||||
Pass Test getting grid-template-columns and grid-template-rows set through CSS for element 'gridWithAutoInsideMinMax' : grid-template-columns = '0px 30px', grid-template-rows = '132px 60px'
|
||||
Pass Test getting and setting grid-template-rows and grid-template-columns through JS: grid-template-columns = '18px 22px', element.style.gridTemplateColumns = '18px 22px', grid-template-rows = '66px 70px', element.style.gridTemplateRows = '66px 70px'
|
||||
Pass Test getting and setting grid-template-rows and grid-template-columns through JS: grid-template-columns = '440px 640px', element.style.gridTemplateColumns = '55% 80%', grid-template-rows = '240px 378px', element.style.gridTemplateRows = '40% 63%'
|
||||
Pass Test getting and setting grid-template-rows and grid-template-columns through JS: grid-template-columns = '0px 0px', element.style.gridTemplateColumns = 'auto auto', grid-template-rows = '0px 0px', element.style.gridTemplateRows = 'auto auto'
|
||||
|
|
|
|||
|
|
@ -6,47 +6,48 @@ Rerun
|
|||
|
||||
Found 42 tests
|
||||
|
||||
42 Fail
|
||||
21 Pass
|
||||
21 Fail
|
||||
Details
|
||||
Result Test Name MessageFail Element 'gridMinContentFixedAndAuto' grid-template-columns value computes to '15px 75px'
|
||||
Fail Element 'gridAutoAndAuto' grid-template-columns value computes to '45px 45px'
|
||||
Result Test Name MessagePass Element 'gridMinContentFixedAndAuto' grid-template-columns value computes to '15px 75px'
|
||||
Pass Element 'gridAutoAndAuto' grid-template-columns value computes to '45px 45px'
|
||||
Fail Element 'gridMinContentAndMinContentFixed' grid-template-columns value computes to '20px 30px'
|
||||
Fail Element 'gridMaxContentAndMinContent' grid-template-columns value computes to '70px 20px'
|
||||
Fail Element 'gridFixedMinContentAndMaxContent' grid-template-columns value computes to '10px 80px'
|
||||
Fail Element 'gridFixedMaxContentAndMinContent' grid-template-columns value computes to '60px 30px'
|
||||
Pass Element 'gridMaxContentAndMinContent' grid-template-columns value computes to '70px 20px'
|
||||
Pass Element 'gridFixedMinContentAndMaxContent' grid-template-columns value computes to '10px 80px'
|
||||
Pass Element 'gridFixedMaxContentAndMinContent' grid-template-columns value computes to '60px 30px'
|
||||
Fail Element 'gridMinContentAndMaxContentFixed' grid-template-columns value computes to '20px 70px'
|
||||
Fail Element 'gridMaxContentFixedAndAuto' grid-template-columns value computes to '65px 25px'
|
||||
Fail Element 'gridAutoMinContent' grid-template-columns value computes to '70px 20px'
|
||||
Pass Element 'gridAutoMinContent' grid-template-columns value computes to '70px 20px'
|
||||
Fail Element 'gridAutoMaxContent' grid-template-columns value computes to '20px 70px'
|
||||
Fail Element 'gridMaxContentAndMinContentFixed' grid-template-columns value computes to '70px 20px'
|
||||
Fail Element 'gridMaxContentAndMaxContentFixed' grid-template-columns value computes to '55px 35px'
|
||||
Fail Element 'gridMinContentFixedAndAutoUnsortedConstrained' grid-template-columns value computes to '0px 40px'
|
||||
Fail Element 'gridAutoAndAutoUnsortedConstrained' grid-template-columns value computes to '10px 30px'
|
||||
Fail Element 'gridMinContentAndMinContentFixedUnsortedConstrained' grid-template-columns value computes to '0px 40px'
|
||||
Fail Element 'gridMaxContentAndMinContentUnsortedConstrained' grid-template-columns value computes to '0px 70px'
|
||||
Pass Element 'gridMinContentFixedAndAutoUnsortedConstrained' grid-template-columns value computes to '0px 40px'
|
||||
Pass Element 'gridAutoAndAutoUnsortedConstrained' grid-template-columns value computes to '10px 30px'
|
||||
Pass Element 'gridMinContentAndMinContentFixedUnsortedConstrained' grid-template-columns value computes to '0px 40px'
|
||||
Pass Element 'gridMaxContentAndMinContentUnsortedConstrained' grid-template-columns value computes to '0px 70px'
|
||||
Fail Element 'gridFixedMinContentAndMaxContentUnsortedConstrained' grid-template-columns value computes to '10px 70px'
|
||||
Fail Element 'gridFixedMaxContentAndMinContentUnsortedConstrained' grid-template-columns value computes to '10px 40px'
|
||||
Pass Element 'gridFixedMaxContentAndMinContentUnsortedConstrained' grid-template-columns value computes to '10px 40px'
|
||||
Fail Element 'gridMinContentAndMaxContentFixedUnsortedConstrained' grid-template-columns value computes to '0px 90px'
|
||||
Fail Element 'gridMaxContentFixedAndAutoUnsortedConstrained' grid-template-columns value computes to '10px 40px'
|
||||
Fail Element 'gridAutoMinContentUnsortedConstrained' grid-template-columns value computes to '0px 60px'
|
||||
Pass Element 'gridAutoMinContentUnsortedConstrained' grid-template-columns value computes to '0px 60px'
|
||||
Fail Element 'gridAutoMaxContentUnsortedConstrained' grid-template-columns value computes to '0px 90px'
|
||||
Fail Element 'gridMaxContentAndMinContentFixedUnsortedConstrained' grid-template-columns value computes to '50px 40px'
|
||||
Fail Element 'gridMaxContentAndMaxContentFixedUnsortedConstrained' grid-template-columns value computes to '40px 70px'
|
||||
Fail Element 'gridMinContentFixedAndAutoUnsorted' grid-template-columns value computes to '15px 90px'
|
||||
Pass Element 'gridMinContentFixedAndAutoUnsorted' grid-template-columns value computes to '15px 90px'
|
||||
Fail Element 'gridAutoAndAutoUnsorted' grid-template-columns value computes to '60px 30px'
|
||||
Fail Element 'gridMinContentAndMinContentFixedUnsorted' grid-template-columns value computes to '0px 40px'
|
||||
Fail Element 'gridMaxContentAndMinContentUnsorted' grid-template-columns value computes to '0px 70px'
|
||||
Pass Element 'gridMinContentAndMinContentFixedUnsorted' grid-template-columns value computes to '0px 40px'
|
||||
Pass Element 'gridMaxContentAndMinContentUnsorted' grid-template-columns value computes to '0px 70px'
|
||||
Fail Element 'gridFixedMinContentAndMaxContentUnsorted' grid-template-columns value computes to '10px 70px'
|
||||
Fail Element 'gridFixedMaxContentAndMinContentUnsorted' grid-template-columns value computes to '50px 40px'
|
||||
Pass Element 'gridFixedMaxContentAndMinContentUnsorted' grid-template-columns value computes to '50px 40px'
|
||||
Fail Element 'gridMinContentAndMaxContentFixedUnsorted' grid-template-columns value computes to '0px 90px'
|
||||
Fail Element 'gridMaxContentFixedAndAutoUnsorted' grid-template-columns value computes to '15px 70px'
|
||||
Fail Element 'gridAutoMinContentUnsorted' grid-template-columns value computes to '50px 60px'
|
||||
Pass Element 'gridMaxContentFixedAndAutoUnsorted' grid-template-columns value computes to '15px 70px'
|
||||
Pass Element 'gridAutoMinContentUnsorted' grid-template-columns value computes to '50px 60px'
|
||||
Fail Element 'gridAutoMaxContentUnsorted' grid-template-columns value computes to '0px 90px'
|
||||
Fail Element 'gridMaxContentAndMinContentFixedUnsorted' grid-template-columns value computes to '50px 40px'
|
||||
Fail Element 'gridMaxContentAndMaxContentFixedUnsorted' grid-template-columns value computes to '40px 70px'
|
||||
Pass Element 'gridMaxContentAndMinContentFixedUnsorted' grid-template-columns value computes to '50px 40px'
|
||||
Pass Element 'gridMaxContentAndMaxContentFixedUnsorted' grid-template-columns value computes to '40px 70px'
|
||||
Fail Element 'gridMinContentFixedAndAutoAboveLimits' grid-template-columns value computes to '15px 95px'
|
||||
Fail Element 'gridMaxContentFixedAndAutoAboveLimits' grid-template-columns value computes to '15px 135px'
|
||||
Fail Element 'gridMinContentFixedAndFixedFixedAndAuto' grid-template-columns value computes to '20px 20px 60px'
|
||||
Fail Element 'gridAutoAndFixedFixedAndMaxContentFixed' grid-template-columns value computes to '110px 20px 20px'
|
||||
Fail Element 'gridMaxContentAndMaxContentFixedAndMaxContent' grid-template-columns value computes to '70px 20px 50px'
|
||||
Pass Element 'gridMaxContentAndMaxContentFixedAndMaxContent' grid-template-columns value computes to '70px 20px 50px'
|
||||
Fail Element 'gridAutoAndMinContentFixedAndMinContent' grid-template-columns value computes to '55px 30px 65px'
|
||||
|
|
@ -11,7 +11,7 @@
|
|||
<link rel="help" href="https://drafts.csswg.org/css-flexbox-1/#min-size-auto">
|
||||
<link rel="help" href="https://drafts.csswg.org/css-sizing-3/#replaced-percentage-min-contribution">
|
||||
<link rel="help" href="https://drafts.csswg.org/css-sizing-3/#min-content-zero">
|
||||
<link rel="stylesheet" href="/fonts/ahem.css">
|
||||
<link rel="stylesheet" href="../../fonts/ahem.css">
|
||||
<meta name="assert" content="This test verifies that an <input> flex item should resolve its percentage part of main size to zero when computing specified size suggestion.">
|
||||
|
||||
<script src="../../resources/testharness.js"></script>
|
||||
|
|
|
|||
|
|
@ -11,7 +11,7 @@
|
|||
<link rel="help" href="https://drafts.csswg.org/css-flexbox-1/#min-size-auto">
|
||||
<link rel="help" href="https://drafts.csswg.org/css-sizing-3/#replaced-percentage-min-contribution">
|
||||
<link rel="help" href="https://drafts.csswg.org/css-sizing-3/#min-content-zero">
|
||||
<link rel="stylesheet" href="/fonts/ahem.css">
|
||||
<link rel="stylesheet" href="../../fonts/ahem.css">
|
||||
<meta name="assert" content="This test verifies that an <input> flex item should resolve its percentage part of main size to zero when computing specified size suggestion.">
|
||||
|
||||
<script src="../../resources/testharness.js"></script>
|
||||
|
|
|
|||
|
|
@ -3,7 +3,7 @@
|
|||
<title>CSS Flexbox: flex-basis with zero pixel</title>
|
||||
<link rel="help" href="https://drafts.csswg.org/css-flexbox/#flex-basis-property">
|
||||
<link rel="help" href="https://drafts.csswg.org/css-flexbox/#intrinsic-main-sizes">
|
||||
<link rel="stylesheet" type="text/css" href="/fonts/ahem.css" />
|
||||
<link rel="stylesheet" type="text/css" href="../../fonts/ahem.css" />
|
||||
<link href="support/flexbox.css" rel="stylesheet">
|
||||
<meta name="assert" content="This test ensures that setting 'flex-basis' property to
|
||||
zero pixel or percentage in combination with one value of both 'flex-grow' and 'flex-shrink'
|
||||
|
|
|
|||
|
|
@ -1,6 +1,6 @@
|
|||
<!DOCTYPE html>
|
||||
<link rel="help" href="https://crbug.com/1097654" />
|
||||
<link rel="stylesheet" type="text/css" href="/fonts/ahem.css" />
|
||||
<link rel="stylesheet" type="text/css" href="../../fonts/ahem.css" />
|
||||
<script src="../../resources/testharness.js"></script>
|
||||
<script src="../../resources/testharnessreport.js"></script>
|
||||
<style>
|
||||
|
|
|
|||
|
|
@ -1,6 +1,6 @@
|
|||
<!DOCTYPE html>
|
||||
<link rel="help" href="https://crbug.com/1081789" />
|
||||
<link rel="stylesheet" type="text/css" href="/fonts/ahem.css" />
|
||||
<link rel="stylesheet" type="text/css" href="../../fonts/ahem.css" />
|
||||
<script src="../../resources/testharness.js"></script>
|
||||
<script src="../../resources/testharnessreport.js"></script>
|
||||
<style>
|
||||
|
|
|
|||
|
|
@ -3,7 +3,7 @@
|
|||
<link rel="help" href="https://drafts.csswg.org/css-flexbox/#intrinsic-sizes">
|
||||
<script src="../../../resources/testharness.js"></script>
|
||||
<script src="../../../resources/testharnessreport.js"></script>
|
||||
<link rel="stylesheet" type="text/css" href="/fonts/ahem.css" />
|
||||
<link rel="stylesheet" type="text/css" href="../../../fonts/ahem.css" />
|
||||
<meta name="assert"
|
||||
content="Requested use cases from our issue tracker that were duplicated or included in the bug report for the new algorithm. These are intentionally not very reduced from their original form with liberal pass conditions." />
|
||||
|
||||
|
|
|
|||
|
|
@ -20,7 +20,7 @@
|
|||
<link rel="help" href="https://www.w3.org/TR/css-flexbox-1/#hypothetical-main-size">
|
||||
<link rel="help" href="https://www.w3.org/TR/css-flexbox-1/#hypothetical-cross-size">
|
||||
<style>
|
||||
@import "/fonts/ahem.css";
|
||||
@import "../../fonts/ahem.css";
|
||||
.flexbox {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
|
|
|
|||
|
|
@ -2,10 +2,10 @@
|
|||
<meta charset="utf-8">
|
||||
<link rel="author" title="Julien Chaffraix" href="mailto:jchaffraix@webkit.org">
|
||||
<link rel="help" href="https://bugs.webkit.org/show_bug.cgi?id=73272">
|
||||
<link href="/css/support/width-keyword-classes.css" rel="stylesheet">
|
||||
<link href="/css/support/grid.css" rel="stylesheet">
|
||||
<link href="/css/support/alignment.css" rel="stylesheet">
|
||||
<link rel="stylesheet" type="text/css" href="/fonts/ahem.css">
|
||||
<link href="../../../css/support/width-keyword-classes.css" rel="stylesheet">
|
||||
<link href="../../../css/support/grid.css" rel="stylesheet">
|
||||
<link href="../../../css/support/alignment.css" rel="stylesheet">
|
||||
<link rel="stylesheet" type="text/css" href="../../../fonts/ahem.css">
|
||||
<link rel="help" href="https://drafts.csswg.org/css-grid/#track-sizing">
|
||||
<meta name="assert" content="Test that setting and getting multiple grid-template-columns and grid-template-rows works as expected">
|
||||
<style>
|
||||
|
|
|
|||
|
|
@ -2,9 +2,9 @@
|
|||
<meta charset="utf-8">
|
||||
<link rel="author" title="Sergio Villar" href="mailto:svillar@igalia.com">
|
||||
<link rel="help" href="https://bugs.chromium.org/p/chromium/issues/detail?id=392200">
|
||||
<link href="/css/support/grid.css" rel="stylesheet">
|
||||
<link href="/css/support/alignment.css" rel="stylesheet">
|
||||
<link rel="stylesheet" type="text/css" href="/fonts/ahem.css">
|
||||
<link href="../../../css/support/grid.css" rel="stylesheet">
|
||||
<link href="../../../css/support/alignment.css" rel="stylesheet">
|
||||
<link rel="stylesheet" type="text/css" href="../../../fonts/ahem.css">
|
||||
<link rel="help" href="https://drafts.csswg.org/css-grid/#track-sizing">
|
||||
<meta name="assert" content="Checks resolution of content sized grid columns and verifies that items are processed by ascending span to compute column breadths">
|
||||
<style>
|
||||
|
|
|
|||
367
Tests/LibWeb/Text/input/wpt-import/css/support/alignment.css
Normal file
367
Tests/LibWeb/Text/input/wpt-import/css/support/alignment.css
Normal file
|
|
@ -0,0 +1,367 @@
|
|||
/* align-self */
|
||||
.alignSelfAuto { align-self: auto; }
|
||||
.alignSelfNormal { align-self: normal; }
|
||||
.alignSelfStretch { align-self: stretch; }
|
||||
.alignSelfStart { align-self: start; }
|
||||
.alignSelfEnd { align-self: end; }
|
||||
.alignSelfCenter { align-self: center; }
|
||||
.alignSelfRight { align-self: right; }
|
||||
.alignSelfLeft { align-self: left; }
|
||||
|
||||
.alignSelfFlexStart { align-self: flex-start; }
|
||||
.alignSelfFlexEnd { align-self: flex-end; }
|
||||
|
||||
.alignSelfSelfStart { align-self: self-start; }
|
||||
.alignSelfSelfEnd { align-self: self-end; }
|
||||
|
||||
.alignSelfSafeCenter { align-self: safe center; }
|
||||
.alignSelfUnsafeCenter { align-self: unsafe center; }
|
||||
.alignSelfSafeEnd { align-self: safe end; }
|
||||
.alignSelfUnsafeEnd { align-self: unsafe end; }
|
||||
.alignSelfSafeSelfEnd { align-self: safe self-end; }
|
||||
.alignSelfUnsafeSelfEnd { align-self: unsafe self-end; }
|
||||
.alignSelfSafeSelfStart { align-self: safe self-start; }
|
||||
.alignSelfUnsafeSelfStart { align-self: unsafe self-start; }
|
||||
.alignSelfSafeRight { align-self: safe right; }
|
||||
.alignSelfUnsafeRight { align-self: unsafe right; }
|
||||
.alignSelfSafeLeft { align-self: safe left; }
|
||||
.alignSelfUnsafeLeft { align-self: unsafe left; }
|
||||
.alignSelfSafeFlexEnd { align-self: safe flex-end; }
|
||||
.alignSelfUnsafeFlexEnd { align-self: unsafe flex-end; }
|
||||
.alignSelfSafeFlexStart { align-self: safe flex-start; }
|
||||
.alignSelfUnsafeFlexStart { align-self: unsafe flex-start; }
|
||||
|
||||
.alignSelfBaseline { align-self: baseline; }
|
||||
.alignSelfFirstBaseline { align-self: first baseline; }
|
||||
.alignSelfLastBaseline { align-self: last baseline; }
|
||||
|
||||
/* align-items */
|
||||
.alignItemsAuto { align-items: auto; }
|
||||
.alignItemsNormal { align-items: normal; }
|
||||
.alignItemsStretch { align-items: stretch; }
|
||||
.alignItemsStart { align-items: start; }
|
||||
.alignItemsCenter { align-items: center; }
|
||||
.alignItemsEnd { align-items: end; }
|
||||
.alignItemsLeft { align-items: left; }
|
||||
.alignItemsRight { align-items: right; }
|
||||
|
||||
.alignItemsFlexStart { align-items: flex-start; }
|
||||
.alignItemsFlexEnd { align-items: flex-end; }
|
||||
|
||||
.alignItemsSelfStart { align-items: self-start; }
|
||||
.alignItemsSelfEnd { align-items: self-end; }
|
||||
|
||||
.alignItemsSafeCenter { align-items: safe center; }
|
||||
.alignItemsUnsafeCenter { align-items: unsafe center; }
|
||||
.alignItemsSafeEnd { align-items: safe end; }
|
||||
.alignItemsUnsafeEnd { align-items: unsafe end; }
|
||||
.alignItemsSafeSelfEnd { align-items: safe self-end; }
|
||||
.alignItemsUnsafeSelfEnd { align-items: unsafe self-end; }
|
||||
.alignItemsSafeSelfStart { align-items: safe self-start; }
|
||||
.alignItemsUnsafeSelfStart { align-items: unsafe self-start; }
|
||||
.alignItemsSafeRight { align-items: safe right; }
|
||||
.alignItemsUnsafeRight { align-items: unsafe right; }
|
||||
.alignItemsSafeLeft { align-items: safe left; }
|
||||
.alignItemsUnsafeLeft { align-items: unsafe left; }
|
||||
.alignItemsSafeFlexEnd { align-items: safe flex-end; }
|
||||
.alignItemsUnsafeFlexEnd { align-items: unsafe flex-end; }
|
||||
.alignItemsSafeFlexStart { align-items: safe flex-start; }
|
||||
.alignItemsUnsafeFlexStart { align-items: unsafe flex-start; }
|
||||
|
||||
.alignItemsBaseline { align-items: baseline; }
|
||||
.alignItemsFirstBaseline { align-items: first baseline; }
|
||||
.alignItemsLastBaseline { align-items: last baseline; }
|
||||
|
||||
/* align-content */
|
||||
.alignContentBaseline { align-content: baseline; }
|
||||
.alignContentLastBaseline { align-content: last-baseline; }
|
||||
.alignContentStart { align-content: start; }
|
||||
.alignContentEnd { align-content: end; }
|
||||
.alignContentCenter { align-content: center; }
|
||||
.alignContentLeft { align-content: left; }
|
||||
.alignContentRight { align-content: right; }
|
||||
|
||||
.alignContentFlexStart { align-content: flex-start; }
|
||||
.alignContentFlexEnd { align-content: flex-end; }
|
||||
|
||||
.alignContentSpaceBetween { align-content: space-between; }
|
||||
.alignContentSpaceAround { align-content: space-around; }
|
||||
.alignContentSpaceEvenly { align-content: space-evenly; }
|
||||
.alignContentStretch { align-content: stretch; }
|
||||
|
||||
.alignContentSafeCenter { align-content: safe center; }
|
||||
.alignContentUnsafeCenter { align-content: unsafe center; }
|
||||
.alignContentSafeEnd { align-content: safe end; }
|
||||
.alignContentUnsafeEnd { align-content: unsafe end; }
|
||||
.alignContentSafeRight { align-content: safe right; }
|
||||
.alignContentUnsafeRight { align-content: unsafe right; }
|
||||
.alignContentSafeLeft { align-content: safe left; }
|
||||
.alignContentUnsafeLeft { align-content: unsafe left; }
|
||||
.alignContentSafeFlexEnd { align-content: safe flex-end; }
|
||||
.alignContentUnsafeFlexEnd { align-content: unsafe flex-end; }
|
||||
.alignContentSafeFlexStart { align-content: safe flex-start; }
|
||||
.alignContentUnsafeFlexStart { align-content: unsafe flex-start; }
|
||||
|
||||
.alignContentBaseline { align-content: baseline; }
|
||||
.alignContentFirstBaseline { align-content: first baseline; }
|
||||
.alignContentLastBaseline { align-content: last baseline; }
|
||||
|
||||
/* justify-self */
|
||||
.justifySelfAuto { justify-self: auto; }
|
||||
.justifySelfNormal { justify-self: normal; }
|
||||
.justifySelfStretch { justify-self: stretch; }
|
||||
.justifySelfStart { justify-self: start; }
|
||||
.justifySelfCenter { justify-self: center; }
|
||||
.justifySelfEnd { justify-self: end; }
|
||||
.justifySelfRight { justify-self: right; }
|
||||
.justifySelfLeft { justify-self: left; }
|
||||
|
||||
.justifySelfFlexStart { justify-self: flex-start; }
|
||||
.justifySelfFlexEnd { justify-self: flex-end; }
|
||||
|
||||
.justifySelfSelfStart { justify-self: self-start; }
|
||||
.justifySelfSelfEnd { justify-self: self-end; }
|
||||
|
||||
.justifySelfSafeCenter { justify-self: safe center; }
|
||||
.justifySelfUnsafeCenter { justify-self: unsafe center; }
|
||||
.justifySelfSafeEnd { justify-self: safe end; }
|
||||
.justifySelfUnsafeEnd { justify-self: unsafe end; }
|
||||
.justifySelfSafeSelfEnd { justify-self: safe self-end; }
|
||||
.justifySelfUnsafeSelfEnd { justify-self: unsafe self-end; }
|
||||
.justifySelfSafeSelfStart { justify-self: safe self-start; }
|
||||
.justifySelfUnsafeSelfStart { justify-self: unsafe self-start; }
|
||||
.justifySelfSafeRight { justify-self: safe right; }
|
||||
.justifySelfUnsafeRight { justify-self: unsafe right; }
|
||||
.justifySelfSafeLeft { justify-self: safe left; }
|
||||
.justifySelfUnsafeLeft { justify-self: unsafe left; }
|
||||
.justifySelfSafeFlexEnd { justify-self: safe flex-end; }
|
||||
.justifySelfUnsafeFlexEnd { justify-self: unsafe flex-end; }
|
||||
.justifySelfSafeFlexStart { justify-self: safe flex-start; }
|
||||
.justifySelfUnsafeFlexStart { justify-self: unsafe flex-start; }
|
||||
|
||||
.justifySelfBaseline { justify-self: baseline; }
|
||||
.justifySelfFirstBaseline { justify-self: first baseline; }
|
||||
.justifySelfLastBaseline { justify-self: last baseline; }
|
||||
|
||||
/* justify-items */
|
||||
.justifyItemsAuto { justify-items: auto; }
|
||||
.justifyItemsNormal { justify-items: normal; }
|
||||
.justifyItemsStretch { justify-items: stretch; }
|
||||
.justifyItemsStart { justify-items: start; }
|
||||
.justifyItemsCenter { justify-items: center; }
|
||||
.justifyItemsEnd { justify-items: end; }
|
||||
.justifyItemsLeft { justify-items: left; }
|
||||
.justifyItemsRight { justify-items: right; }
|
||||
|
||||
.justifyItemsFlexStart { justify-items: flex-start; }
|
||||
.justifyItemsFlexEnd { justify-items: flex-end; }
|
||||
|
||||
.justifyItemsSelfStart { justify-items: self-start; }
|
||||
.justifyItemsSelfEnd { justify-items: self-end; }
|
||||
|
||||
.justifyItemsLegacy { justify-items: legacy; }
|
||||
.justifyItemsLegacyLeft { justify-items: legacy left; }
|
||||
.justifyItemsLegacyCenter { justify-items: legacy center; }
|
||||
.justifyItemsLegacyRight { justify-items: legacy right; }
|
||||
.justifyItemsLeftLegacy { justify-items: left legacy; }
|
||||
.justifyItemsCenterLegacy { justify-items: center legacy; }
|
||||
.justifyItemsRightLegacy { justify-items: right legacy; }
|
||||
|
||||
.justifyItemsSafeCenter { justify-items: safe center; }
|
||||
.justifyItemsUnsafeCenter { justify-items: unsafe center; }
|
||||
.justifyItemsSafeEnd { justify-items: safe end; }
|
||||
.justifyItemsUnsafeEnd { justify-items: unsafe end; }
|
||||
.justifyItemsSafeSelfEnd { justify-items: safe self-end; }
|
||||
.justifyItemsUnsafeSelfEnd { justify-items: unsafe self-end; }
|
||||
.justifyItemsSafeSelfStart { justify-items: safe self-start; }
|
||||
.justifyItemsUnsafeSelfStart { justify-items: unsafe self-start; }
|
||||
.justifyItemsSafeRight { justify-items: safe right; }
|
||||
.justifyItemsUnsafeRight { justify-items: unsafe right; }
|
||||
.justifyItemsSafeLeft { justify-items: safe left; }
|
||||
.justifyItemsUnsafeLeft { justify-items: unsafe left; }
|
||||
.justifyItemsSafeFlexEnd { justify-items: safe flex-end; }
|
||||
.justifyItemsUnsafeFlexEnd { justify-items: unsafe flex-end; }
|
||||
.justifyItemsSafeFlexStart { justify-items: safe flex-start; }
|
||||
.justifyItemsUnsafeFlexStart { justify-items: unsafe flex-start; }
|
||||
|
||||
.justifyItemsTest { justify-items: safe end; }
|
||||
|
||||
.justifyItemsBaseline { justify-items: baseline; }
|
||||
.justifyItemsFirstBaseline { justify-items: first baseline; }
|
||||
.justifyItemsLastBaseline { justify-items: last baseline; }
|
||||
|
||||
/* justify-content */
|
||||
.justifyContentBaseline { justify-content: baseline; }
|
||||
.justifyContentLastBaseline { justify-content: last-baseline; }
|
||||
.justifyContentStart { justify-content: start; }
|
||||
.justifyContentEnd { justify-content: end; }
|
||||
.justifyContentCenter { justify-content: center; }
|
||||
.justifyContentLeft { justify-content: left; }
|
||||
.justifyContentRight { justify-content: right; }
|
||||
|
||||
.justifyContentFlexStart { justify-content: flex-start; }
|
||||
.justifyContentFlexEnd { justify-content: flex-end; }
|
||||
|
||||
.justifyContentSpaceBetween { justify-content: space-between; }
|
||||
.justifyContentSpaceAround { justify-content: space-around; }
|
||||
.justifyContentSpaceEvenly { justify-content: space-evenly; }
|
||||
.justifyContentStretch { justify-content: stretch; }
|
||||
|
||||
.justifyContentSafeCenter { justify-content: safe center; }
|
||||
.justifyContentUnsafeCenter { justify-content: unsafe center; }
|
||||
.justifyContentSafeEnd { justify-content: safe end; }
|
||||
.justifyContentUnsafeEnd { justify-content: unsafe end; }
|
||||
.justifyContentSafeRight { justify-content: safe right; }
|
||||
.justifyContentUnsafeRight { justify-content: unsafe right; }
|
||||
.justifyContentSafeLeft { justify-content: safe left; }
|
||||
.justifyContentUnsafeLeft { justify-content: unsafe left; }
|
||||
.justifyContentSafeFlexEnd { justify-content: safe flex-end; }
|
||||
.justifyContentUnsafeFlexEnd { justify-content: unsafe flex-end; }
|
||||
.justifyContentSafeFlexStart { justify-content: safe flex-start; }
|
||||
.justifyContentUnsafeFlexStart { justify-content: unsafe flex-start; }
|
||||
|
||||
.justifyContentBaseline { justify-content: baseline; }
|
||||
.justifyContentFirstBaseline { justify-content: first baseline; }
|
||||
.justifyContentLastBaseline { justify-content: last baseline; }
|
||||
|
||||
/* Both align-items and justify-items */
|
||||
.itemsNormal {
|
||||
align-items: normal;
|
||||
justify-items: normal;
|
||||
}
|
||||
|
||||
.itemsStretch {
|
||||
align-items: stretch;
|
||||
justify-items: stretch;
|
||||
}
|
||||
|
||||
.itemsStart {
|
||||
align-items: start;
|
||||
justify-items: start;
|
||||
}
|
||||
|
||||
.itemsCenter {
|
||||
align-items: center;
|
||||
justify-items: center;
|
||||
}
|
||||
|
||||
.itemsEnd {
|
||||
align-items: end;
|
||||
justify-items: end;
|
||||
}
|
||||
|
||||
.itemsLeft {
|
||||
align-items: left;
|
||||
justify-items: left;
|
||||
}
|
||||
|
||||
.itemsRight {
|
||||
align-items: right;
|
||||
justify-items: right;
|
||||
}
|
||||
|
||||
.itemsSelfStart {
|
||||
align-items: self-start;
|
||||
justify-items: self-start;
|
||||
}
|
||||
|
||||
.itemsSelfEnd {
|
||||
align-items: self-end;
|
||||
justify-items: self-end;
|
||||
}
|
||||
.itemsBaseline {
|
||||
align-items: baseline;
|
||||
justify-items: baseline;
|
||||
}
|
||||
|
||||
/* Both align-self and justify-self */
|
||||
.selfStretch {
|
||||
align-self: stretch;
|
||||
justify-self: stretch;
|
||||
}
|
||||
.selfStart {
|
||||
align-self: start;
|
||||
justify-self: start;
|
||||
}
|
||||
.selfEnd {
|
||||
align-self: end;
|
||||
justify-self: end;
|
||||
}
|
||||
.selfCenter {
|
||||
align-self: center;
|
||||
justify-self: center;
|
||||
}
|
||||
.selfRight {
|
||||
align-self: right;
|
||||
justify-self: right;
|
||||
}
|
||||
.selfLeft {
|
||||
align-self: left;
|
||||
justify-self: left;
|
||||
}
|
||||
.selfSelfStart {
|
||||
align-self: self-start;
|
||||
justify-self: self-start;
|
||||
}
|
||||
.selfSelfEnd {
|
||||
align-self: self-end;
|
||||
justify-self: self-end;
|
||||
}
|
||||
.selfBaseline {
|
||||
align-self: baseline;
|
||||
justify-self: baseline;
|
||||
}
|
||||
|
||||
/* Both align-content and justify-content */
|
||||
.contentStart {
|
||||
align-content: start;
|
||||
justify-content: start;
|
||||
}
|
||||
.contentCenter {
|
||||
align-content: center;
|
||||
justify-content: center;
|
||||
}
|
||||
.contentEnd {
|
||||
align-content: end;
|
||||
justify-content: end;
|
||||
}
|
||||
|
||||
.contentCenterSafe {
|
||||
align-content: safe center;
|
||||
justify-content: safe center;
|
||||
}
|
||||
|
||||
.contentCenterUnsafe {
|
||||
align-content: unsafe center;
|
||||
justify-content: unsafe center;
|
||||
}
|
||||
|
||||
.contentEndSafe {
|
||||
align-content: safe end;
|
||||
justify-content: safe end;
|
||||
}
|
||||
|
||||
.contentEndUnsafe {
|
||||
align-content: unsafe end;
|
||||
justify-content: unsafe end;
|
||||
}
|
||||
|
||||
.contentSpaceBetween {
|
||||
justify-content: space-between;
|
||||
align-content: space-between;
|
||||
}
|
||||
|
||||
.contentSpaceAround {
|
||||
justify-content: space-around;
|
||||
align-content: space-around;
|
||||
}
|
||||
|
||||
.contentSpaceEvenly {
|
||||
justify-content: space-evenly;
|
||||
align-content: space-evenly;
|
||||
}
|
||||
|
||||
.contentStretch {
|
||||
justify-content: stretch;
|
||||
align-content: stretch;
|
||||
}
|
||||
289
Tests/LibWeb/Text/input/wpt-import/css/support/grid.css
Normal file
289
Tests/LibWeb/Text/input/wpt-import/css/support/grid.css
Normal file
|
|
@ -0,0 +1,289 @@
|
|||
.grid {
|
||||
display: grid;
|
||||
background-color: grey;
|
||||
}
|
||||
|
||||
.inline-grid {
|
||||
display: inline-grid;
|
||||
background-color: grey;
|
||||
}
|
||||
|
||||
.firstRowFirstColumn {
|
||||
background-color: blue;
|
||||
grid-column: 1;
|
||||
grid-row: 1;
|
||||
}
|
||||
|
||||
.onlyFirstRowOnlyFirstColumn {
|
||||
background-color: blue;
|
||||
grid-column: 1 / 2;
|
||||
grid-row: 1 / 2;
|
||||
}
|
||||
|
||||
.firstRowSecondColumn {
|
||||
background-color: lime;
|
||||
grid-column: 2;
|
||||
grid-row: 1;
|
||||
}
|
||||
|
||||
.onlyFirstRowOnlySecondColumn {
|
||||
background-color: lime;
|
||||
grid-column: 2 / 3;
|
||||
grid-row: 1 / 2;
|
||||
}
|
||||
|
||||
.firstRowThirdColumn {
|
||||
background-color: magenta;
|
||||
grid-column: 3;
|
||||
grid-row: 1;
|
||||
}
|
||||
|
||||
.firstRowFourthColumn {
|
||||
background-color: green;
|
||||
grid-column: 4;
|
||||
grid-row: 1;
|
||||
}
|
||||
|
||||
.secondRowFirstColumn {
|
||||
background-color: purple;
|
||||
grid-column: 1;
|
||||
grid-row: 2;
|
||||
}
|
||||
|
||||
.onlySecondRowOnlyFirstColumn {
|
||||
background-color: purple;
|
||||
grid-column: 1 / 2;
|
||||
grid-row: 2 / 3;
|
||||
}
|
||||
|
||||
.secondRowSecondColumn {
|
||||
background-color: orange;
|
||||
grid-column: 2;
|
||||
grid-row: 2;
|
||||
}
|
||||
|
||||
.onlySecondRowOnlySecondColumn {
|
||||
background-color: orange;
|
||||
grid-column: 2 / 3;
|
||||
grid-row: 2 / 3;
|
||||
}
|
||||
|
||||
.endSecondRowEndSecondColumn {
|
||||
background-color: orange;
|
||||
grid-column-end: 3;
|
||||
grid-row-end: 3;
|
||||
}
|
||||
|
||||
.secondRowThirdColumn {
|
||||
background-color: navy;
|
||||
grid-column: 3;
|
||||
grid-row: 2;
|
||||
}
|
||||
|
||||
.secondRowFourthColumn {
|
||||
background-color: pink;
|
||||
grid-column: 4;
|
||||
grid-row: 2;
|
||||
}
|
||||
|
||||
.thirdRowFirstColumn {
|
||||
background-color: green;
|
||||
grid-column: 1;
|
||||
grid-row: 3;
|
||||
}
|
||||
|
||||
.thirdRowSecondColumn {
|
||||
background-color: red;
|
||||
grid-column: 2;
|
||||
grid-row: 3;
|
||||
}
|
||||
|
||||
.thirdRowThirdColumn {
|
||||
background-color: salmon;
|
||||
grid-column: 3;
|
||||
grid-row: 3;
|
||||
}
|
||||
|
||||
.firstAutoRowSecondAutoColumn {
|
||||
grid-row: 1 / auto;
|
||||
grid-column: 2 / auto;
|
||||
}
|
||||
|
||||
.autoLastRowAutoLastColumn {
|
||||
grid-row: auto / -1;
|
||||
grid-column: auto / -1;
|
||||
}
|
||||
|
||||
.autoSecondRowAutoFirstColumn {
|
||||
grid-row: auto / 2;
|
||||
grid-column: auto / 1;
|
||||
}
|
||||
|
||||
.firstRowBothColumn {
|
||||
grid-row: 1;
|
||||
grid-column: 1 / -1;
|
||||
}
|
||||
|
||||
.secondRowBothColumn {
|
||||
grid-row: 2;
|
||||
grid-column: 1 / -1;
|
||||
}
|
||||
|
||||
.bothRowFirstColumn {
|
||||
grid-row: 1 / -1;
|
||||
grid-column: 1;
|
||||
}
|
||||
|
||||
.bothRowSecondColumn {
|
||||
grid-row: 1 / -1;
|
||||
grid-column: 2;
|
||||
}
|
||||
|
||||
.bothRowBothColumn {
|
||||
grid-row: 1 / -1;
|
||||
grid-column: 1 / -1;
|
||||
}
|
||||
|
||||
/* Auto column / row. */
|
||||
.autoRowAutoColumn {
|
||||
background-color: pink;
|
||||
grid-column: auto;
|
||||
grid-row: auto;
|
||||
}
|
||||
|
||||
.firstRowAutoColumn {
|
||||
background-color: blue;
|
||||
grid-column: auto;
|
||||
grid-row: 1;
|
||||
}
|
||||
|
||||
.secondRowAutoColumn {
|
||||
background-color: purple;
|
||||
grid-column: auto;
|
||||
grid-row: 2;
|
||||
}
|
||||
|
||||
.thirdRowAutoColumn {
|
||||
background-color: navy;
|
||||
grid-column: auto;
|
||||
grid-row: 3;
|
||||
}
|
||||
|
||||
.autoRowFirstColumn {
|
||||
background-color: lime;
|
||||
grid-column: 1;
|
||||
grid-row: auto;
|
||||
}
|
||||
|
||||
.autoRowSecondColumn {
|
||||
background-color: orange;
|
||||
grid-column: 2;
|
||||
grid-row: auto;
|
||||
}
|
||||
|
||||
.autoRowThirdColumn {
|
||||
background-color: magenta;
|
||||
grid-column: 3;
|
||||
grid-row: auto;
|
||||
}
|
||||
|
||||
.autoRowAutoColumnSpanning2 {
|
||||
background-color: maroon;
|
||||
grid-column: span 2;
|
||||
grid-row: auto;
|
||||
}
|
||||
|
||||
.autoRowSpanning2AutoColumn {
|
||||
background-color: aqua;
|
||||
grid-column: auto;
|
||||
grid-row: span 2;
|
||||
}
|
||||
|
||||
.autoRowSpanning2AutoColumnSpanning3 {
|
||||
background-color: olive;
|
||||
grid-column: span 3;
|
||||
grid-row: span 2;
|
||||
}
|
||||
|
||||
.autoRowSpanning3AutoColumnSpanning2 {
|
||||
background-color: indigo;
|
||||
grid-column: span 2;
|
||||
grid-row: span 3;
|
||||
}
|
||||
|
||||
.autoRowFirstColumnSpanning2 {
|
||||
background-color: maroon;
|
||||
grid-column: 1 / span 2;
|
||||
grid-row: auto;
|
||||
}
|
||||
|
||||
.autoRowSecondColumnSpanning2 {
|
||||
background-color: olive;
|
||||
grid-column: 2 / span 2;
|
||||
grid-row: auto;
|
||||
}
|
||||
|
||||
.firstRowSpanning2AutoColumn {
|
||||
background-color: maroon;
|
||||
grid-column: auto;
|
||||
grid-row: 1 / span 2;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
.secondRowSpanning2AutoColumn {
|
||||
background-color: olive;
|
||||
grid-column: auto;
|
||||
grid-row: 2 / span 2;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
/* Grid element flow. */
|
||||
.gridAutoFlowColumnSparse {
|
||||
grid-auto-flow: column;
|
||||
}
|
||||
|
||||
.gridAutoFlowColumnDense {
|
||||
grid-auto-flow: column dense;
|
||||
}
|
||||
|
||||
.gridAutoFlowRowSparse {
|
||||
grid-auto-flow: row;
|
||||
}
|
||||
|
||||
.gridAutoFlowRowDense {
|
||||
grid-auto-flow: row dense;
|
||||
}
|
||||
|
||||
/* This rule makes sure the container is smaller than any grid items to avoid distributing any extra logical space to them. */
|
||||
.constrainedContainer {
|
||||
width: 10px;
|
||||
height: 10px;
|
||||
}
|
||||
|
||||
.unconstrainedContainer {
|
||||
width: 1000px;
|
||||
height: 1000px;
|
||||
}
|
||||
|
||||
.sizedToGridArea {
|
||||
font: 10px/1 Ahem;
|
||||
/* Make us fit our grid area. */
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
.verticalRL {
|
||||
writing-mode: vertical-rl;
|
||||
}
|
||||
.verticalLR {
|
||||
writing-mode: vertical-lr;
|
||||
}
|
||||
.horizontalTB {
|
||||
writing-mode: horizontal-tb;
|
||||
}
|
||||
.directionRTL {
|
||||
direction: rtl;
|
||||
}
|
||||
.directionLTR {
|
||||
direction: ltr;
|
||||
}
|
||||
|
|
@ -0,0 +1,43 @@
|
|||
/*
|
||||
Take every possible line break so the box width is the width of largest
|
||||
unbreakable line box.
|
||||
*/
|
||||
.min-content {
|
||||
width: min-content;
|
||||
}
|
||||
|
||||
.max-content {
|
||||
width: max-content;
|
||||
}
|
||||
|
||||
/*
|
||||
Shrink wrap just like floating.
|
||||
max(min-content, min(max-content, fill-available))
|
||||
*/
|
||||
.fit-content {
|
||||
width: fit-content;
|
||||
}
|
||||
|
||||
.max-width-min-content {
|
||||
max-width: min-content;
|
||||
}
|
||||
|
||||
.max-width-max-content {
|
||||
max-width: max-content;
|
||||
}
|
||||
|
||||
.max-width-fit-content {
|
||||
max-width: fit-content;
|
||||
}
|
||||
|
||||
.min-width-min-content {
|
||||
min-width: min-content;
|
||||
}
|
||||
|
||||
.min-width-max-content {
|
||||
min-width: max-content;
|
||||
}
|
||||
|
||||
.min-width-fit-content {
|
||||
min-width: fit-content;
|
||||
}
|
||||
Loading…
Reference in a new issue