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

Issues Search
    My Issues | Starred     Open | Closed | All

Side by Side Diff: LayoutTests/fast/css/css-properties-position-relative-as-parent-fixed.html

Issue 669143002: Make css-properties-position-relative-as-parent-fixed.html a ref-test (Closed) Base URL: https://chromium.googlesource.com/chromium/blink.git@master
Patch Set: Created 6 years, 2 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
« no previous file with comments | « no previous file | LayoutTests/fast/css/css-properties-position-relative-as-parent-fixed-expected.txt » ('j') | no next file with comments »
Toggle Intra-line Diffs ('i') | Expand Comments ('e') | Collapse Comments ('c') | Show Comments Hide Comments ('s')
OLDNEW
1 <!DOCTYPE html> 1 <!DOCTYPE html>
2 <html> 2 <html>
3 <head> 3 <head>
4 <style>
5 html, body, h5, pre {
6 margin: 0;
7 }
8
9 .container {
10 position: relative;
11 left: 150px;
12 font: 10px/1 Ahem;
13 }
14
15 .main {
16 width: 400px;
17 }
18
19 .relative {
20 position: relative;
21 }
22
23 .fixed {
24 position: fixed;
25 }
26
27 .green {
28 color: green;
29 background-color: lime;
30 }
31
32 .red {
33 color: red;
34 }
35
36 .grey {
37 color: grey;
38 background-color: silver;
39 }
40
41 .rtl {
42 direction: rtl;
43 }
44 </style>
45 <script src="../../resources/check-layout.js"></script>
4 </head> 46 </head>
5 <body style="position:fixed; left:150px;"> 47 <body onload="checkLayout('.container')">
6 <h3>Test for chromium bug : <a href="https://code.google.com/p/chromium/issues/d etail?id=31286">31286</a>. css rendering bug : fixed-position-element and 'left' .</h3> 48 <h3>Test for chromium bug : <a href="https://code.google.com/p/chromium/issu es/detail?id=31286">31286</a>. css rendering bug : fixed-position-element and 'l eft'.</h3>
7 <h4>If fixed position inline element does not have left and/or right position th en it should render as normal flow.</h4> 49 <p>If fixed position inline element does not have left and/or right position then it should render as normal flow.</p>
8 50
9 <h5> 51 <h5>Case 1: fixed text box (red) should be just after relative text box (gre en).</h5>
10 Case 1 : fixed text box should be just after relative text box. 52 <div class="container">
11 <br/> 53 <div class="main relative green" style="left: 100px;" data-offset-x="100 ">
54 XXXXXXXXXX
55 <span class="fixed red" data-offset-x="350">
Julien - ping for review 2014/10/23 01:22:27 Nit: I would change red for another color (blue, p
Manuel Rego 2014/10/23 08:12:21 I agree, I was just using red because of it was in
56 XXXXX
57 </span>
58 </div>
59 </div>
12 60
13 <div style="position:relative; left:100px; background:green; width:400px;"> 61 <h5>Case 2: fixed text box (red) should be just before relative text box (gr een).</h5>
14 relative 62 <div class="container">
15 <span style="position:fixed; background:red;"> 63 <div class="main relative green rtl" style="left: 100px;" data-offset-x= "100">
16 fixed 64 XXXXXXXXXX
17 </span> 65 <span class="fixed red" data-offset-x="500">
18 </span> 66 XXXXX
19 </div> 67 </span>
68 </div>
69 </div>
20 70
21 Case 2 : fixed text box should be just before relative text box. 71 <h5>Case 3: fixed text box (red) should be just after relative text box (gre en).</h5>
22 <br/> 72 <div class="container">
73 <div class="main relative green" style="right: 100px;" data-offset-x="-1 00">
74 XXXXXXXXXX
75 <span class="fixed red" data-offset-x="150">
76 XXXXX
77 </span>
78 </div>
79 </div>
23 80
24 <div style="position:relative; left:100px; background:green; direction:rtl; widt h:400px;"> 81 <h5>Case 4: fixed text box (red) should be just before relative text box (gr een).</h5>
25 relative 82 <div class="container">
26 <span style="position:fixed; background:red;"> 83 <div class="main relative green rtl" style="right: 100px;" data-offset-x ="-100">
27 fixed 84 XXXXXXXXXX
28 </span> 85 <span class="fixed red" data-offset-x="300">
29 </span> 86 XXXXX
30 </div> 87 </span>
88 </div>
89 </div>
31 90
32 Case 3 : fixed text box should be just after relative text box. 91 <h5>Case 5: fixed text box (red) should be just after relative text box (gre en).</h5>
33 <br/> 92 <div class="container">
93 <div class="main relative grey" style="left: 100px;" data-offset-x="100" >
94 XXXXXXXXX
95 <span class="relative green" style="left: 50px;" data-offset-x="150" >
96 XXXXXXXXXXXXXXX
97 <span class="fixed red" data-offset-x="550">
98 XXXXX
99 </span>
100 </span>
101 </div>
102 </div>
34 103
35 <div style="position:relative; right:100px; background:green; width:400px;"> 104 <h5>Case 6: fixed text box (red) should be after relative text box (grey) in some distance and before the other relative text box (green) in some distance.< /h5>
36 relative 105 <div class="container">
37 <span style="position:fixed; background:red;"> 106 <div class="main relative grey rtl" style="left: 100px;" data-offset-x=" 100">
38 fixed 107 XXXXX
39 </span> 108 <span class="relative green" style="left: 150px;" data-offset-x="400 ">
40 </span> 109 XXXXXXXXX
41 </div> 110 <span class="fixed red" data-offset-x="600">
Julien - ping for review 2014/10/23 01:22:27 That doesn't match the description and old result
Manuel Rego 2014/10/23 08:12:21 The offset in the fixed elements is absolute, so i
Julien - ping for review 2014/10/23 15:54:21 You're right, the offset is defined with respect t
Manuel Rego 2014/10/24 10:07:37 FWIW, the checkLayout() test could also be checked
111 XXXXX
112 </span>
113 </span>
114 </div>
115 </div>
42 116
43 Case 4 : fixed text box should be just before relative text box. 117 <h5>Case 7: fixed text box (red) should be just after relative text box (gre en).</h5>
44 <br/> 118 <div class="container">
119 <div class="main relative grey" style="left: 100px;" data-offset-x="100" >
120 XXXXXXXXXXXXXX
121 <span class="relative green" style="right: 50px;" data-offset-x="100 ">
122 XXXXXXXXXX
123 <span class="fixed red" data-offset-x="450">
124 XXXXX
125 </span>
126 </span>
127 </div>
128 </div>
45 129
46 <div style="position:relative; right:100px; background:green; direction:rtl; wid th:400px;"> 130 <h5>Case 8: fixed text box (red) should be before relative text box (green) in some distance.</h5>
47 relative 131 <div class="container">
48 <span style="position:fixed; background:red;"> 132 <div class="main relative grey rtl" style="left: 100px;" data-offset-x=" 100">
49 fixed 133 XXXXX
50 </span> 134 <span class="relative green" style="right: 150px;" data-offset-x="10 0">
51 </span> 135 XXXXXXXXX
52 </div> 136 <span class="fixed red" data-offset-x="300">
Julien - ping for review 2014/10/23 01:22:27 This doesn't seem to match the description / visua
Manuel Rego 2014/10/23 08:12:21 Ditto.
137 XXXXX
138 </span>
139 </span>
140 </div>
141 </div>
53 142
54 Case 5 : fixed text box should be just after relative2 text box. 143 <h5>Case 9: fixed text box (red) should be just after relative text box (gre en).</h5>
55 <br/> 144 <div class="container">
145 <div class="main relative grey" style="right: 100px;" data-offset-x="-10 0">
146 XXXXXXXXXXXXXX
147 <span class="relative green" style="left: 50px;" data-offset-x="200" >
148 XXXXXXXXXX
149 <span class="fixed red" data-offset-x="350">
150 XXXXX
151 </span>
152 </span>
153 </div>
154 </div>
56 155
57 <div style="position:relative; left:100px; background:gray; width:400px;"> 156 <h5>Case 10: fixed text box (red) should be after relative text box (grey) i n some distance and before other relative text box (green) in some distance.</h5 >
58 relative 157 <div class="container">
59 <span style="position:relative; left:100px; background:green;"> 158 <div class="main relative grey rtl" style="right: 100px;" data-offset-x= "-100">
60 relative2 159 XXXXX
61 <span style="position:fixed; background:red;"> 160 <span class="relative green" style="left: 150px;" data-offset-x="400 ">
62 fixed 161 XXXXXXXXX
63 </span> 162 <span class="fixed red" data-offset-x="400">
64 </span> 163 XXXXX
65 </div> 164 </span>
165 </span>
166 </div>
167 </div>
66 168
67 Case 6 : fixed text box should be after relative text box in some distance and b efore relative2 in some distance. 169 <h5>Case 11: fixed text box (red) should be just after relative text box (gr een).</h5>
68 <br/> 170 <div class="container">
171 <div class="main relative grey" style="right: 100px;" data-offset-x="-10 0">
172 XXXXXXXXXXXXXX
173 <span class="relative green" style="right: 50px;" data-offset-x="100 ">
174 XXXXXXXXXX
175 <span class="fixed red" data-offset-x="250">
176 XXXXX
177 </span>
178 </span>
179 </div>
180 </div>
69 181
70 <div style="position:relative; left:100px; background:gray; direction:rtl; width :400px;"> 182 <h5>Case 12: fixed text box (red) should be before relative text box (green) in some distance.</h5>
71 relative 183 <div class="container">
72 <span style="position:relative; left:100px; background:green;"> 184 <div class="main relative grey rtl" style="right: 100px;" data-offset-x= "-100">
73 relative2 185 XXXX
74 <span style="position:fixed; background:red;"> 186 <span class="relative green" style="right: 150px;" data-offset-x="10 0">
75 fixed 187 XXXXXXXXXX
76 </span> 188 <span class="fixed red" data-offset-x="100">
77 </span> 189 XXXXX
78 </div> 190 </span>
191 </span>
192 </div>
193 </div>
79 194
80 Case 7 : fixed text box should be just after relative2 text box. 195 </body>
81 <br/> 196 </html>
82
83 <div style="position:relative; left:100px; background:gray; width:400px;">
84 relative
85 <span style="position:relative; right:100px; background:green;">
86 relative2
87 <span style="position:fixed; background:red;">
88 fixed
89 </span>
90 </span>
91 </div>
92
93 Case 8 : fixed text box should be before relative2 text box in some distance.
94 <br/>
95
96 <div style="position:relative; left:100px; background:gray; direction:rtl; width :400px;">
97 relative
98 <span style="position:relative; right:100px; background:green;">
99 relative2
100 <span style="position:fixed; background:red;">
101 fixed
102 </span>
103 </span>
104 </div>
105
106 Case 9 : fixed text box should be just after relative2 text box.
107 <br/>
108
109 <div style="position:relative; right:100px; background:gray; width:400px;">
110 relative
111 <span style="position:relative; left:100px; background:green;">
112 relative2
113 <span style="position:fixed; background:red;">
114 fixed
115 </span>
116 </span>
117 </div>
118
119 Case 10 : fixed text box should be after relative text box in some distance and before relative2 in some distance.
120 <br/>
121
122 <div style="position:relative; right:100px; background:gray; direction:rtl; widt h:400px;">
123 relative
124 <span style="position:relative; left:100px; background:green;">
125 relative2
126 <span style="position:fixed; background:red;">
127 fixed
128 </span>
129 </span>
130 </div>
131
132 Case 11 : fixed text box should be just after relative2 text box.
133 <br/>
134
135 <div style="position:relative; right:100px; background:gray; width:400px;">
136 relative
137 <span style="position:relative; right:100px; background:green;">
138 relative2
139 <span style="position:fixed; background:red;">
140 fixed
141 </span>
142 </span>
143 </div>
144
145 Case 12 : fixed text box should be before relative2 text box in some distance.
146 <br/>
147
148 <div style="position:relative; right:100px; background:gray; direction:rtl; widt h:400px;">
149 relative
150 <span style="position:relative; right:100px; background:green;">
151 relative2
152 <span style="position:fixed; background:red;">
153 fixed
154 </span>
155 </span>
156 </div>
157
158 </h5>
OLDNEW
« no previous file with comments | « no previous file | LayoutTests/fast/css/css-properties-position-relative-as-parent-fixed-expected.txt » ('j') | no next file with comments »

Powered by Google App Engine
This is Rietveld 408576698