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

Issues Search
    My Issues | Starred     Open | Closed | All

Side by Side Diff: third_party/WebKit/LayoutTests/fast/css/getComputedStyle/getComputedStyle-resolved-values.html

Issue 1890743002: Reland of ix getComputedStyle positioned element values (Closed) Base URL: https://chromium.googlesource.com/chromium/src.git@lkgr
Patch Set: 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
« no previous file with comments | « third_party/WebKit/LayoutTests/animations/play-state.html ('k') | third_party/WebKit/LayoutTests/fast/css/getComputedStyle/getComputedStyle-resolved-values-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> 4 <style>
5 .outer { 5 .outer {
6 width: 500px; 6 width: 500px;
7 height: 300px; 7 height: 300px;
8 border: 1px solid black; 8 border: 1px solid black;
9 } 9 }
10 10
11 #abs_container {
12 position: relative;
13 }
14
11 .testbox { 15 .testbox {
12 color: white; 16 color: white;
13 font: 24px 'Lucida Grande'; 17 font: 24px 'Lucida Grande';
14 background: green; 18 background: green;
15 border: 1em solid black; 19 border: 1em solid black;
16 } 20 }
17 21
18 #fixed { 22 #fixed {
19 line-height: 30px; 23 line-height: 30px;
20 width: 150px; 24 width: 150px;
(...skipping 40 matching lines...) Expand 10 before | Expand all | Expand 10 after
61 width: 30%; 65 width: 30%;
62 height: 20%; 66 height: 20%;
63 margin-top: 3em; 67 margin-top: 3em;
64 /* margin-right/margin-bottom omitted */ 68 /* margin-right/margin-bottom omitted */
65 margin-left: auto; 69 margin-left: auto;
66 padding-top: 40px; 70 padding-top: 40px;
67 padding-right: 10%; 71 padding-right: 10%;
68 padding-bottom: 1em; 72 padding-bottom: 1em;
69 padding-left: auto; 73 padding-left: auto;
70 } 74 }
75
76 #rel_positioned {
77 position: relative;
78 line-height: 30px;
79 width: 150px;
80 height: 100px;
81 left: 10px;
82 top: 15px;
83 margin-top: 15px;
84 margin-right: 30px;
85 margin-bottom: 20px;
86 margin-left: 10px;
87 padding: 20px;
88 }
89
90 #abs_positioned {
91 position: absolute;
92 line-height: 30px;
93 width: 150px;
94 height: 100px;
95 right: 10px;
96 bottom: 15px;
97 margin-top: 15px;
98 margin-right: 30px;
99 margin-bottom: 20px;
100 margin-left: 10px;
101 padding: 20px;
102 }
103
71 </style> 104 </style>
72 105
73 <script> 106 <script>
74 var resolvedValueStyles = [ 107 var resolvedValueStyles = [
75 'line-height', 108 'line-height',
76 'width', 109 'width',
77 'height', 110 'height',
111 'top',
112 'right',
113 'bottom',
114 'left',
78 'margin-top', 115 'margin-top',
79 'margin-right', 116 'margin-right',
80 'margin-bottom', 117 'margin-bottom',
81 'margin-left', 118 'margin-left',
82 'padding-top', 119 'padding-top',
83 'padding-right', 120 'padding-right',
84 'padding-bottom', 121 'padding-bottom',
85 'padding-left' 122 'padding-left'
86 ]; 123 ];
87 124
(...skipping 29 matching lines...) Expand all
117 154
118 function runTests() { 155 function runTests() {
119 if (window.testRunner) 156 if (window.testRunner)
120 testRunner.dumpAsText(); 157 testRunner.dumpAsText();
121 158
122 test('fixed'); 159 test('fixed');
123 test('percents'); 160 test('percents');
124 test('ems'); 161 test('ems');
125 test('auto'); 162 test('auto');
126 test('mixed'); 163 test('mixed');
164 test('rel_positioned');
165 test('abs_positioned');
127 } 166 }
128 </script> 167 </script>
129 </head> 168 </head>
130 169
131 <body onload="runTests();"> 170 <body onload="runTests();">
132 <p> 171 <p>
133 Test calling getPropertyValue on computed styles that return "resolved" values.<br /> 172 Test calling getPropertyValue on computed styles that return "resolved" values.<br />
134 See <a href="http://dev.w3.org/csswg/cssom/#resolved-values">http://dev. w3.org/csswg/cssom/#resolved-values</a> for more information. 173 See <a href="http://dev.w3.org/csswg/cssom/#resolved-values">http://dev. w3.org/csswg/cssom/#resolved-values</a> for more information.
135 </p> 174 </p>
136 <pre id="console"></pre> 175 <pre id="console"></pre>
137 176
138 <div class="outer"> 177 <div class="outer">
139 <div class="testbox" id="fixed">Fixed</div> 178 <div class="testbox" id="fixed">Fixed</div>
140 </div> 179 </div>
141 <div class="outer"> 180 <div class="outer">
142 <div class="testbox" id="percents">Percents</div> 181 <div class="testbox" id="percents">Percents</div>
143 </div> 182 </div>
144 <div class="outer"> 183 <div class="outer">
145 <div class="testbox" id="ems">EMs</div> 184 <div class="testbox" id="ems">EMs</div>
146 </div> 185 </div>
147 <div class="outer"> 186 <div class="outer">
148 <div class="testbox" id="auto">Auto</div> 187 <div class="testbox" id="auto">Auto</div>
149 </div> 188 </div>
150 <div class="outer"> 189 <div class="outer">
151 <div class="testbox" id="mixed">Mixed</div> 190 <div class="testbox" id="mixed">Mixed</div>
152 </div> 191 </div>
192 <div class="outer">
193 <div class="testbox" id="rel_positioned">Relative Positioned</div>
194 </div>
195 <div class="outer" id="abs_container">
196 <div class="testbox" id="abs_positioned">Absolute Positioned</div>
197 </div>
153 </body> 198 </body>
154 </html> 199 </html>
OLDNEW
« no previous file with comments | « third_party/WebKit/LayoutTests/animations/play-state.html ('k') | third_party/WebKit/LayoutTests/fast/css/getComputedStyle/getComputedStyle-resolved-values-expected.txt » ('j') | no next file with comments »

Powered by Google App Engine
This is Rietveld 408576698