| OLD | NEW |
|---|
| (Empty) |
| 1 <!doctype html> | |
| 2 <html style="direction:rtl"> | |
| 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 text-align:right; | |
| 29 height:100%; | |
| 30 background-color:#00a000; | |
| 31 color:#ffff00; | |
| 32 font: 16px/1.25 monospace; | |
| 33 } | |
| 34 | |
| 35 .greyColor { | |
| 36 background-color:#cccccc; | |
| 37 } | |
| 38 | |
| 39 #region1, #region2, #region3 { | |
| 40 border:1px solid black; | |
| 41 } | |
| 42 | |
| 43 #region1 { | |
| 44 position:relative; | |
| 45 width:200px; | |
| 46 height:150px; | |
| 47 } | |
| 48 | |
| 49 #region2 { | |
| 50 position:relative; | |
| 51 width:300px; | |
| 52 height:180px; | |
| 53 } | |
| 54 | |
| 55 #region3 { | |
| 56 position:relative; | |
| 57 width:120px; | |
| 58 height:120px; | |
| 59 } | |
| 60 </style> | |
| 61 </head> | |
| 62 | |
| 63 <body> | |
| 64 | |
| 65 <p style="direction:ltr">The green positioned object should go through all three
regions. Its right edge should align with | |
| 66 the right side of the light grey boxes in each region. No red should be visible.
</p> | |
| 67 | |
| 68 <div id="container"> | |
| 69 <div id="region1"> | |
| 70 <div class="grey-box1 greyColor"> | |
| 71 <div class="green-box"> | |
| 72 Some text.<br> | |
| 73 Some text.<br> | |
| 74 Some text.<br> | |
| 75 Some text.<br> | |
| 76 Some text.<br> | |
| 77 Some text.<br> | |
| 78 Some text.<br> | |
| 79 </div> | |
| 80 </div> | |
| 81 </div> | |
| 82 <div id="region2"> | |
| 83 <div class="grey-box2 greyColor"> | |
| 84 <div class="green-box"> | |
| 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 Some text.<br> | |
| 92 Some text.<br> | |
| 93 Some text.<br> | |
| 94 </div> | |
| 95 </div> | |
| 96 </div> | |
| 97 <div id="region3"> | |
| 98 <div class="grey-box3 greyColor"> | |
| 99 <div class="green-box"> | |
| 100 Some text.<br> | |
| 101 Some text.<br> | |
| 102 Some text.<br> | |
| 103 </div> | |
| 104 </div> | |
| 105 </div> | |
| 106 </div> | |
| 107 </body> | |
| 108 </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