| OLD | NEW |
|---|
| (Empty) |
| 1 <!doctype html> | |
| 2 <html> | |
| 3 <head> | |
| 4 <style> | |
| 5 .grey-box1 { | |
| 6 margin-left:10%; | |
| 7 margin-right:10%; | |
| 8 margin-top:15%; | |
| 9 height:120px; | |
| 10 } | |
| 11 | |
| 12 .grey-box2 { | |
| 13 margin-left:10%; | |
| 14 margin-right:10%; | |
| 15 height:100%; | |
| 16 } | |
| 17 | |
| 18 .grey-box3 { | |
| 19 margin-left:10%; | |
| 20 margin-right:10%; | |
| 21 height:50px; | |
| 22 } | |
| 23 | |
| 24 .green-box { | |
| 25 position:absolute; | |
| 26 top:0; | |
| 27 width:50%; | |
| 28 height:100%; | |
| 29 background-color:#00a000; | |
| 30 color:#ffff00; | |
| 31 font: 16px/1.25 monospace; | |
| 32 } | |
| 33 | |
| 34 .greyColor { | |
| 35 background-color:#cccccc; | |
| 36 } | |
| 37 | |
| 38 #region1, #region2, #region3 { | |
| 39 border:1px solid black; | |
| 40 } | |
| 41 | |
| 42 #region1 { | |
| 43 position:relative; | |
| 44 width:200px; | |
| 45 height:150px; | |
| 46 } | |
| 47 | |
| 48 #region2 { | |
| 49 position:relative; | |
| 50 width:300px; | |
| 51 height:180px; | |
| 52 } | |
| 53 | |
| 54 #region3 { | |
| 55 position:relative; | |
| 56 width:120px; | |
| 57 height:120px; | |
| 58 } | |
| 59 </style> | |
| 60 </head> | |
| 61 <body> | |
| 62 | |
| 63 <p>The green positioned object should go through all three regions. Its left edg
e should align with the left side of the light grey boxes in each region. No red
should be visible.</p> | |
| 64 | |
| 65 <div id="container"> | |
| 66 <div id="region1"> | |
| 67 <div class="grey-box1 greyColor"> | |
| 68 <div class="green-box"> | |
| 69 Some text.<br> | |
| 70 Some text.<br> | |
| 71 Some text.<br> | |
| 72 Some text.<br> | |
| 73 Some text.<br> | |
| 74 Some text.<br> | |
| 75 Some text.<br> | |
| 76 </div> | |
| 77 </div> | |
| 78 </div> | |
| 79 <div id="region2"> | |
| 80 <div class="grey-box2 greyColor"> | |
| 81 <div class="green-box"> | |
| 82 Some text.<br> | |
| 83 Some text.<br> | |
| 84 Some text.<br> | |
| 85 Some text.<br> | |
| 86 Some text.<br> | |
| 87 Some text.<br> | |
| 88 Some text.<br> | |
| 89 Some text.<br> | |
| 90 Some text.<br> | |
| 91 </div> | |
| 92 </div> | |
| 93 </div> | |
| 94 <div id="region3"> | |
| 95 <div class="grey-box3 greyColor"> | |
| 96 <div class="green-box"> | |
| 97 Some text.<br> | |
| 98 Some text.<br> | |
| 99 Some text.<br> | |
| 100 </div> | |
| 101 </div> | |
| 102 </div> | |
| 103 </div> | |
| 104 | |
| 105 </body> | |
| 106 </html> | |
| OLD | NEW |
|---|
Chromium Code Reviews
Issue 159933010:
Remove everything region-specific from LayoutTests. (Closed)
Base URL: https://chromium.googlesource.com/chromium/blink.git@master