OLD | NEW |
1 <!DOCTYPE html> | 1 <!DOCTYPE html> |
2 <html> | 2 <html> |
3 <style> | 3 <style> |
4 .grid { | 4 .grid { |
5 width: 400px; | 5 width: 500px; |
6 height: 300px; | 6 height: 300px; |
7 border: 5px solid black; | 7 border: 5px solid black; |
8 margin: 30px; | 8 margin: 30px; |
9 padding: 15px; | 9 padding: 15px; |
10 background-color: grey; | |
11 } | 10 } |
12 | 11 |
13 .container { | 12 .container { |
14 position: relative; | 13 position: relative; |
15 float: left; | 14 float: left; |
16 } | 15 } |
17 | 16 |
18 .absolute { | 17 .absolute { |
19 position: absolute; | 18 position: absolute; |
20 } | 19 } |
21 | 20 |
22 .green { | 21 .green { |
23 background-color: green; | 22 background-color: green; |
24 } | 23 } |
25 </style> | 24 </style> |
26 <body> | 25 <body> |
27 | 26 |
28 <p>This test checks that the background of positioned items is painted in the ri
ght position.</p> | 27 <p>This test checks that the background of positioned items is painted in the ri
ght position using RTL direction.</p> |
29 | 28 |
30 <p>The test passes if you see 4 green boxes and no red.</p> | 29 <p>The test passes if you see 4 green boxes and no red.</p> |
31 | 30 |
32 <div class="container"> | 31 <div class="container"> |
33 <div class="grid"></div> | 32 <div class="grid"></div> |
34 <div class="absolute green" style="left: 55px; top: 50px; width: 100px; heig
ht: 50px"></div> | 33 <div class="absolute green" style="left: 455px; top: 50px; width: 100px; hei
ght: 50px"></div> |
35 <div class="absolute green" style="left: 290px; top: 50px; width: 50px; heig
ht: 20px"></div> | 34 <div class="absolute green" style="left: 390px; top: 50px; width: 50px; heig
ht: 20px"></div> |
36 <div class="absolute green" style="left: 50px; top: 115px; width: 50px; heig
ht: 30px"></div> | 35 <div class="absolute green" style="left: 500px; top: 115px; width: 50px; hei
ght: 30px"></div> |
37 <div class="absolute green" style="left: 175px; top: 135px; width: 145px; he
ight: 75px"></div> | 36 <div class="absolute green" style="left: 275px; top: 135px; width: 145px; he
ight: 75px"></div> |
38 </div> | 37 </div> |
39 | 38 |
40 </body> | 39 </body> |
OLD | NEW |