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

Side by Side Diff: LayoutTests/fast/table/absolute-table-percent-lengths-expected.html

Issue 341523002: Resolve percent lengths for abs. positioned tables against padding box. (Closed) Base URL: https://chromium.googlesource.com/chromium/blink.git@master
Patch Set: Created 6 years, 6 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 <style>
3 div {
4 position: relative;
5 border: 5px solid black;
6 height: 60px;
7 width: 60px;
8 padding: 20px;
9 float: left;
Julien - ping for review 2014/06/17 20:57:42 Do we really need some relative float?
10 margin: 10px;
11 }
12
13 div span.tbl {
14 display: block;
15 background-color: skyblue;
16 position: absolute;
17 width: 50%;
18 height: 50%;
19 }
20
21 div:nth-child(1) span.tbl { left: 0; top: 0; }
22 div:nth-child(2) span.tbl { right: 0; top: 0; }
23 div:nth-child(3) span.tbl { right: 0; bottom: 0; }
24 div:nth-child(4) span.tbl { left: 0; bottom: 0; }
Julien - ping for review 2014/06/17 20:57:43 I prefer to use simple selectors (class, id) when
andersr 2014/06/18 05:42:40 Yes, that's true. I think you mentioned this in a
25
26 hr { clear: left; }
27
28 #vertical > div {
29 -webkit-writing-mode: vertical-lr;
30 }
31
32 </style>
33 <p>Tests that percent lengths of an absolutely positioned table is resolved
34 against the <em>padding box</em> of the parent. PASS if, for each row below:</p>
35 <ul>
36 <li>There is a blue <em>50px square</em> in each box.</li>
37 <li>The blue square appears in these corners (in order): top-left, top-right , bottom-right, bottom-left.</li>
38 </ul>
39 <p>Note that "abc" appears in the squares just to indicate the writing mode for the row.</p>
40 <hr>
41 <section id="horizontal">
42 <div><span class="tbl"><span class="cell">abc</span></span></div>
43 <div><span class="tbl"><span class="cell">abc</span></span></div>
44 <div><span class="tbl"><span class="cell">abc</span></span></div>
45 <div><span class="tbl"><span class="cell">abc</span></span></div>
46 </section>
47 <hr>
48 <section id="vertical">
49 <div><span class="tbl"><span class="cell">abc</span></span></div>
50 <div><span class="tbl"><span class="cell">abc</span></span></div>
51 <div><span class="tbl"><span class="cell">abc</span></span></div>
52 <div><span class="tbl"><span class="cell">abc</span></span></div>
53 </section>
OLDNEW

Powered by Google App Engine
This is Rietveld 408576698