3 <link href=
"resources/grid.css" rel=
"stylesheet">
6 grid-template-columns:
100px
300px;
7 grid-template-rows:
50px
150px;
24 .percentPaddingAndMargin {
31 <script src=
"../../resources/check-layout.js"></script>
32 <body onload=
"checkLayout('.grid')">
34 <p>Test that resolving percentage padding and margin on grid items works properly on a fixed grid with different writing modes.
</p>
37 <div class=
"firstRowFirstColumn percentPadding" data-expected-padding-top=
"50" data-expected-padding-right=
"50" data-expected-padding-bottom=
"50" data-expected-padding-left=
"50"></div>
38 <div class=
"firstRowSecondColumn percentMargin" data-expected-margin-top=
"150" data-expected-margin-right=
"150" data-expected-margin-bottom=
"150" data-expected-margin-left=
"150"></div>
39 <div class=
"secondRowFirstColumn percentPaddingAndMargin" data-expected-padding-top=
"10" data-expected-padding-right=
"10" data-expected-padding-bottom=
"10" data-expected-padding-left=
"10" data-expected-margin-top=
"20" data-expected-margin-right=
"20" data-expected-margin-bottom=
"20" data-expected-margin-left=
"20"></div>
40 <div class=
"secondRowSecondColumn percentPaddingAndMargin" data-expected-padding-top=
"30" data-expected-padding-right=
"30" data-expected-padding-bottom=
"30" data-expected-padding-left=
"30" data-expected-margin-top=
"60" data-expected-margin-right=
"60" data-expected-margin-bottom=
"60" data-expected-margin-left=
"60"></div>
43 <div class=
"grid verticalRL">
44 <div class=
"firstRowFirstColumn percentPadding" data-expected-padding-top=
"50" data-expected-padding-right=
"50" data-expected-padding-bottom=
"50" data-expected-padding-left=
"50"></div>
45 <div class=
"firstRowSecondColumn percentMargin" data-expected-margin-top=
"150" data-expected-margin-right=
"150" data-expected-margin-bottom=
"150" data-expected-margin-left=
"150"></div>
46 <div class=
"secondRowFirstColumn percentPaddingAndMargin" data-expected-padding-top=
"10" data-expected-padding-right=
"10" data-expected-padding-bottom=
"10" data-expected-padding-left=
"10" data-expected-margin-top=
"20" data-expected-margin-right=
"20" data-expected-margin-bottom=
"20" data-expected-margin-left=
"20"></div>
47 <div class=
"secondRowSecondColumn percentPaddingAndMargin" data-expected-padding-top=
"30" data-expected-padding-right=
"30" data-expected-padding-bottom=
"30" data-expected-padding-left=
"30" data-expected-margin-top=
"60" data-expected-margin-right=
"60" data-expected-margin-bottom=
"60" data-expected-margin-left=
"60"></div>
51 <div class=
"firstRowFirstColumn percentPadding verticalRL" data-expected-padding-top=
"50" data-expected-padding-right=
"50" data-expected-padding-bottom=
"50" data-expected-padding-left=
"50"></div>
52 <div class=
"firstRowSecondColumn percentMargin verticalRL" data-expected-margin-top=
"150" data-expected-margin-right=
"150" data-expected-margin-bottom=
"150" data-expected-margin-left=
"150"></div>
53 <div class=
"secondRowFirstColumn percentPaddingAndMargin verticalRL" data-expected-padding-top=
"10" data-expected-padding-right=
"10" data-expected-padding-bottom=
"10" data-expected-padding-left=
"10" data-expected-margin-top=
"20" data-expected-margin-right=
"20" data-expected-margin-bottom=
"20" data-expected-margin-left=
"20"></div>
54 <div class=
"secondRowSecondColumn percentPaddingAndMargin verticalRL" data-expected-padding-top=
"30" data-expected-padding-right=
"30" data-expected-padding-bottom=
"30" data-expected-padding-left=
"30" data-expected-margin-top=
"60" data-expected-margin-right=
"60" data-expected-margin-bottom=
"60" data-expected-margin-left=
"60"></div>
58 <div class=
"firstRowFirstColumn percentPadding verticalRL" data-expected-padding-top=
"50" data-expected-padding-right=
"50" data-expected-padding-bottom=
"50" data-expected-padding-left=
"50"></div>
59 <div class=
"firstRowSecondColumn percentMargin" data-expected-margin-top=
"150" data-expected-margin-right=
"150" data-expected-margin-bottom=
"150" data-expected-margin-left=
"150"></div>
60 <div class=
"secondRowFirstColumn percentPaddingAndMargin verticalRL" data-expected-padding-top=
"10" data-expected-padding-right=
"10" data-expected-padding-bottom=
"10" data-expected-padding-left=
"10" data-expected-margin-top=
"20" data-expected-margin-right=
"20" data-expected-margin-bottom=
"20" data-expected-margin-left=
"20"></div>
61 <div class=
"secondRowSecondColumn percentPaddingAndMargin" data-expected-padding-top=
"30" data-expected-padding-right=
"30" data-expected-padding-bottom=
"30" data-expected-padding-left=
"30" data-expected-margin-top=
"60" data-expected-margin-right=
"60" data-expected-margin-bottom=
"60" data-expected-margin-left=
"60"></div>