Chromium Code Reviews Chromium Code Reviews
Issue 178453002:
Add tests for sticky and various display values (Closed)
Base URL: https://chromium.googlesource.com/chromium/blink.git@master| Index: LayoutTests/fast/css/sticky/sticky-display.html |
| diff --git a/LayoutTests/fast/css/sticky/sticky-left.html b/LayoutTests/fast/css/sticky/sticky-display.html |
| similarity index 55% |
| copy from LayoutTests/fast/css/sticky/sticky-left.html |
| copy to LayoutTests/fast/css/sticky/sticky-display.html |
| index b2537be107d69c398955d76598e9d53943bcc444..6c7a0cfa58c5b2e3e5d83b8b872452133fcd9ae6 100644 |
| --- a/LayoutTests/fast/css/sticky/sticky-left.html |
| +++ b/LayoutTests/fast/css/sticky/sticky-display.html |
| @@ -8,19 +8,24 @@ |
| width: 2000px; |
| overflow: hidden; /* hide scrollbars */ |
| } |
| - |
| + |
| + p { |
| + position: relative; |
| + left: 100px; |
| + } |
| + |
| .group { |
| position: relative; |
| width: 500px; |
| height: 200px; |
| } |
| - |
| + |
| .container { |
| width: 400px; |
| height: 180px; |
| outline: 2px solid black; |
| } |
| - |
| + |
| .box { |
| width: 200px; |
| height: 180px; |
| @@ -31,7 +36,7 @@ |
| left: 100px; |
| background-color: green; |
| } |
| - |
| + |
| .indicator { |
| position: absolute; |
| top: 0; |
| @@ -48,25 +53,40 @@ |
| </script> |
| </head> |
| <body> |
| - <div class="group"> |
| - <div class="indicator box" style="left: 200px;"></div> |
| + <p>Block</p> |
| + <div class="group" style="left: 100px"> |
| + <div class="indicator box" style="left: 100px;"></div> |
| <div class="container"> |
| <div class="sticky box"></div> |
| </div> |
| </div> |
| + <p>Table</p> |
| <div class="group" style="left: 100px"> |
| <div class="indicator box" style="left: 100px;"></div> |
| <div class="container"> |
| - <div class="sticky box"></div> |
| + <div class="sticky box" style="display:table"></div> |
| + </div> |
| + </div> |
| + |
| + <p>Grid</p> |
| + <div class="group" style="left: 100px"> |
| + <div class="indicator box" style="left: 100px;"></div> |
| + <div class="container"> |
| + <div class="sticky box" style="display:-webkit-grid"></div> |
| </div> |
| </div> |
| - <div class="group" style="left: 200px"> |
| - <div class="indicator box" style="left: 0;"></div> |
| + <p>Flex box</p> |
| + <div class="group" style="left: 100px"> |
| + <div class="indicator box" style="left: 100px;"></div> |
| <div class="container"> |
| - <div class="sticky box"></div> |
| + <div class="sticky box" style="display:-webkit-flex"></div> |
|
ojan
2014/02/25 00:51:29
grid and flexbox are both unprefixed.
|
| </div> |
| </div> |
| + <div style="position: absolute; top: 500px;"> |
| + This test checks the behavior of position:sticky with various display values. |
| + There should be no red. |
| + </div> |
| </body> |
| </html> |
