Chromium Code Reviews
chromiumcodereview-hr@appspot.gserviceaccount.com (chromiumcodereview-hr) | Please choose your nickname with Settings | Help | Chromium Project | Gerrit Changes | Sign out
(346)

Side by Side Diff: third_party/WebKit/LayoutTests/fast/css/sticky/sticky-horizontally-overconstrained-ltr.html

Issue 1308273010: Adapt and reland old position sticky implementation (Closed) Base URL: https://chromium.googlesource.com/chromium/blink.git@master
Patch Set: Make sticky vertical ref tests expectations not dependent on font size. Created 4 years, 8 months ago
Use n/p to move between diff chunks; N/P to move between comments. Draft comments are only viewable by you.
Jump to:
View unified diff | Download patch
OLDNEW
(Empty)
1 <!DOCTYPE html>
2 <script>
3 if (window.internals) {
4 internals.settings.setCSSStickyPositionEnabled(true);
5 }
6 </script>
7
8 <html>
9 <head>
10 <style>
11 #overflow {
12 width: 600px;
13 height: 450px;
14 overflow: hidden; /* Still scrollable with JS */
15 border: 1px solid black;
16 }
17
18 .group {
19 position: relative;
20 width: 500px;
21 height: 150px;
22 }
23
24 .container {
25 width: 400px;
26 height: 130px;
27 outline: 2px solid black;
28 }
29
30 .box {
31 width: 200px;
32 height: 130px;
33 }
34
35 .sticky {
36 position: sticky;
37 left: 100px;
38 right: 200px;
39 background-color: green;
40 }
41
42 .indicator {
43 position: absolute;
44 top: 0;
45 left: 0;
46 background-color: red;
47 }
48 </style>
49 <script>
50 function doTest()
51 {
52 document.getElementById('overflow').scrollLeft = 100;
53 }
54 window.addEventListener('load', doTest, false);
55 </script>
56 </head>
57 <body>
58 This test checks that right offset is ignored with overconstrained sticky positi oning and ltr text direction.
59 There should be no red.
60 <div id="overflow">
61 <div class="group">
62 <div class="indicator box" style="left: 200px;"></div>
63 <div class="container">
64 <div class="sticky box"></div>
65 </div>
66 </div>
67
68 <div class="group" style="left: 100px">
69 <div class="indicator box" style="left: 100px;"></div>
70 <div class="container">
71 <div class="sticky box"></div>
72 </div>
73 </div>
74
75 <div class="group" style="left: 200px">
76 <div class="indicator box" style="left: 0;"></div>
77 <div class="container">
78 <div class="sticky box"></div>
79 </div>
80 </div>
81 </div>
82 </body>
83 </html>
OLDNEW

Powered by Google App Engine
This is Rietveld 408576698