OLD | NEW |
(Empty) | |
| 1 <!DOCTYPE HTML> |
| 2 <link href="resources/grid.css" rel="stylesheet"> |
| 3 <script src="../../resources/check-layout.js"></script> |
| 4 <style> |
| 5 .grid { |
| 6 grid-template: 200px 200px / 200px 200px; |
| 7 width: -webkit-fit-content; |
| 8 position: relative; |
| 9 } |
| 10 #fromFixedWidth { width: 150px; } |
| 11 #fromFixedHeight { height: 100px; } |
| 12 #fromMarginAuto { margin: auto; } |
| 13 </style> |
| 14 <p>The grids below had initially 'stretched' items, but we have changed 'height'
, 'width' and 'margin' to values which don't allow stretch. This test verifies t
hat the layout algorithm properly detects such changes and clear the override he
ight and width accordingly.</p> |
| 15 <div class="grid"> |
| 16 <div id="toFixedHeight" class="firstRowFirstColumn" data-expected-width="200
" data-expected-height="100"></div> |
| 17 <div class="firstRowSecondColumn" data-expected-width="200" data-expected-he
ight="200"></div> |
| 18 <div class="secondRowFirstColumn" data-expected-width="200" data-expected-he
ight="200"></div> |
| 19 <div id="fromFixedHeight" class="secondRowSecondColumn" data-expected-width=
"200" data-expected-height="200"></div> |
| 20 </div> |
| 21 <div class="grid"> |
| 22 <div id="toFixedWidth" class="firstRowFirstColumn" data-expected-width="150"
data-expected-height="200"></div> |
| 23 <div class="firstRowSecondColumn" data-expected-width="200" data-expected-he
ight="200"></div> |
| 24 <div class="secondRowFirstColumn" data-expected-width="200" data-expected-he
ight="200"></div> |
| 25 <div id="fromFixedWidth" class="secondRowSecondColumn" data-expected-width="
200" data-expected-height="200"></div> |
| 26 </div> |
| 27 <div class="grid"> |
| 28 <div id="toMarginAuto" class="firstRowFirstColumn" data-expected-width="150"
data-expected-height="100"> |
| 29 <div style="width: 150px; height: 100px"></div> |
| 30 </div> |
| 31 <div class="firstRowSecondColumn" data-expected-width="200" data-expected-he
ight="200"></div> |
| 32 <div class="secondRowFirstColumn" data-expected-width="200" data-expected-he
ight="200"></div> |
| 33 <div id="fromMarginAuto" class="secondRowSecondColumn" data-expected-width="
200" data-expected-height="200"> |
| 34 <div style="width: 150px; height: 100px"></div> |
| 35 </div> |
| 36 </div> |
| 37 <script> |
| 38 document.body.offsetLeft; |
| 39 document.getElementById("fromFixedHeight").style.height = "auto"; |
| 40 document.getElementById("toFixedHeight").style.height = "100px"; |
| 41 document.getElementById("fromFixedWidth").style.width = "auto"; |
| 42 document.getElementById("toFixedWidth").style.width = "150px"; |
| 43 document.getElementById("fromMarginAuto").style.margin = "0"; |
| 44 document.getElementById("toMarginAuto").style.margin = "auto"; |
| 45 checkLayout(".grid"); |
| 46 </script> |
OLD | NEW |