OLD | NEW |
1 <!DOCTYPE html> | 1 <!DOCTYPE html> |
2 <html> | 2 <html> |
3 <link href="resources/flexbox.css" rel="stylesheet"> | 3 <link href="resources/flexbox.css" rel="stylesheet"> |
4 <style> | 4 <style> |
5 body { | 5 body { |
6 margin: 0; | 6 margin: 0; |
7 } | 7 } |
8 .flexbox { | 8 .flexbox { |
9 background-color: green; | 9 background-color: green; |
10 height: 100px; | 10 height: 100px; |
11 width: 100px; | 11 width: 100px; |
12 margin: 10px; | 12 margin: 10px; |
13 } | 13 } |
14 .flexbox > * { | 14 .flexbox > * { |
15 -webkit-flex: none; | 15 flex: none; |
16 -moz-flex: none; | 16 -moz-flex: none; |
17 } | 17 } |
18 .relative { | 18 .relative { |
19 position: relative; | 19 position: relative; |
20 } | 20 } |
21 .flexbox > div { | 21 .flexbox > div { |
22 width: 20px; | 22 width: 20px; |
23 height: 20px; | 23 height: 20px; |
24 } | 24 } |
25 .absolute { | 25 .absolute { |
(...skipping 115 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
141 var beforePosition = absolute.getBoundingClientRect(); | 141 var beforePosition = absolute.getBoundingClientRect(); |
142 document.querySelector('.flexbox').style.height = '101px'; | 142 document.querySelector('.flexbox').style.height = '101px'; |
143 var afterPosition = absolute.getBoundingClientRect(); | 143 var afterPosition = absolute.getBoundingClientRect(); |
144 | 144 |
145 // Positioned element should not change position when the height of it's parent
flexbox is changed. | 145 // Positioned element should not change position when the height of it's parent
flexbox is changed. |
146 for (key in beforePosition) | 146 for (key in beforePosition) |
147 shouldBe('beforePosition[key]', 'afterPosition[key]'); | 147 shouldBe('beforePosition[key]', 'afterPosition[key]'); |
148 </script> | 148 </script> |
149 </body> | 149 </body> |
150 </html> | 150 </html> |
OLD | NEW |