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

Issues Search
    My Issues | Starred     Open | Closed | All

Side by Side Diff: third_party/WebKit/LayoutTests/css-display-3/resources/display-contents-acid.html

Issue 2450093005: Support display: contents for elements, first-line and first-letter pseudos. (Closed)
Patch Set: Support display: contents for elements, first-line and first-letter pseudos. Created 4 years, 1 month 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/css-display-3/display-contents-td-001-expected.html ('k') | third_party/WebKit/LayoutTests/shadow-dom/slots-fallback-in-document-tree-expected.html » ('j') | third_party/WebKit/Source/core/dom/LayoutTreeBuilderTraversal.h » ('J')
Toggle Intra-line Diffs ('i') | Expand Comments ('e') | Collapse Comments ('c') | Show Comments Hide Comments ('s')
OLDNEW
(Empty)
1 <!DOCTYPE html>
2 <!--
3 Any copyright is dedicated to the Public Domain.
4 http://creativecommons.org/publicdomain/zero/1.0/
5 -->
6 <html lang="en-US">
7 <head>
8 <meta charset="UTF-8">
9 <title>CSS Test: CSS display:contents</title>
10 <link rel="author" title="Mats Palmgren" href="https://bugzilla.mozilla.org/sh ow_bug.cgi?id=907396">
11 <link rel="help" href="http://dev.w3.org/csswg/css-display">
12 <style type="text/css">
13
14 html,body {
15 color:black; background-color:white; font-size:16px; padding:0; marg in:0;
16 }
17
18 .table { display:table; border-collapse:collapse; border: blue solid 1pt;}
19 .itable { display:inline-table; }
20 .caption { display:table-caption; }
21 .cell { display:table-cell; border:inherit; }
22 .row { display:table-row; border: green dashed 1pt; }
23 .rowg { display:table-row-group; }
24 .head { display:table-header-group; }
25 .foot { display:table-footer-group; }
26 .col { display:table-column; }
27 .colg { display:table-column-group; }
28 .flex { display:flex; }
29 .iflex { display:inline-flex; }
30 .li { display:list-item; }
31 .ib { display:inline-block; }
32 .inline { display:inline; }
33 .columns { -moz-columns:2; columns:2; height:4em; }
34
35 .contents { display:contents; align-items:inherit; justify-items:inherit; }
36
37 .c1 { color:lime; }
38 .c2 { background:blue; color:pink; }
39 .c3 { color:teal; }
40 .c4 { color:green; }
41 .c5 { color:silver; }
42 .c6 { color:cyan; }
43 .c7 { color:magenta; }
44 .c8 { color:yellow; }
45 .c9 { color:grey; }
46 .c10{ color:black; }
47
48 .b { background:inherit; }
49 </style>
50 </head>
51 <body style="color:red">
52
53 <div class="contents c1"><div class="contents c2"><div class="caption">1<span cl ass="b">1</span></div></div></div>
54 <div class="contents c2"><div class="row">2a<div class="cell">2<div class="conte nts c2">b<span class="b">b</span></div></div></div></div>
55 <div class="contents c3"><div class="cell">3</div></div>
56 <div class="contents c4"><div class="rowg">4</div></div>
57 <div class="contents c5"><div class="cell">5a</div></div>
58 <div class="cell c5">5b</div>
59 <div class="contents c6"><div class="head">6</div></div>
60 <div class="contents c7"><div class="cell"><div class="contents c2">7<span class ="b">a</span></div></div></div>
61 <div class="contents c8"><div class="cell">7b</div></div>
62 <div class="contents c9"><div class="foot">8</div></div>
63 <div class="contents c9"><div class="foot">9<div class="contents c2">a<span clas s="b">b</span>c</div></div></div>
64 <div class="contents c10"><div class="cell">10</div></div>
65
66 <div class="table" style="float:right">
67 <div class="contents c1"><div class="contents c2"><div class="caption">1<span cl ass="b">1</span></div></div></div>
68 <div class="contents c2"><div class="row">2a<div class="cell">2<div class="conte nts c2">b<span class="b">b</span></div></div></div></div>
69 <div class="contents c3"><div class="cell">3</div></div>
70 <div class="contents c4"><div class="rowg">4</div></div>
71 <div class="contents c5"><div class="cell">5a</div></div>
72 <div class="cell c5">5b</div>
73 <div class="contents c6"><div class="head">6</div></div>
74 <div class="contents c7"><div class="cell"><div class="contents c2">7<span class ="b">a</span></div></div></div>
75 <div class="contents c8"><div class="cell">7b</div></div>
76 <div class="contents c9"><div class="foot">8</div></div>
77 <div class="contents c9"><div class="foot">9<div class="contents c2">a<span clas s="b">b</span>c</div></div></div>
78 <div class="contents c10"><div class="cell">10</div></div>
79 </div>
80
81 <div class="flex c1">
82 0
83 <div class="contents c1">x</div>
84 <div class="contents c1"><div class="contents c2">y</div></div>
85 <div class="contents c1"><div class="contents c2"><div class="">1<span class="b" >1</span></div></div></div>
86 <div class="contents c2"><div class="inline">2a<div class="">2<div class="conten ts c2">b<span class="b">b</span></div></div></div></div>
87 <div class="contents c3"><div class="inline">3</div></div>
88 <div class="inline"><div class="contents c4">4</div></div>
89 <div class=""><div class="contents c5">5a</div></div>
90 <div class=" c5">5b</div>
91 <div class="contents c6"><div class="">6</div></div>
92 <div class="ib"><div class="contents c7"><div class="contents c2">7<span class=" b">a</span></div></div></div>
93 <div class="contents c9"><div class="">8</div></div>
94 <div class="contents c9"><div class="contents">9<div class="contents c2">a<span class="b">b</span>c</div></div></div>
95 <div class="contents c10"><div class="">10</div></div>
96 </div>
97
98 <div class="flex"><div class="contents c2">
99 0
100 <div class="contents c1">x</div>
101 <div class="contents c1"><div class="contents c2">y</div></div>
102 <div class="contents c1"><div class="contents c2"><div class="">1<span class="b" >1</span></div></div></div>
103 <div class="contents c2"><div class="inline">2a<div class="">2<div class="conten ts c2">b<span class="b">b</span></div></div></div></div>
104 <div class="contents c3"><div class="inline">3</div></div>
105 <div class=""><div class="contents c4">4</div></div>
106 <div class=""><div class="contents c5">5a</div></div>
107 <div class=" c5">5b</div>
108 <div class="contents c6"><div class="">6</div></div>
109 <div class="ib"><div class="contents c7"><div class="contents c2">7<span class=" b">a</span></div></div></div>
110 <div class="contents c9"><div class="">8</div></div>
111 <div class="contents c9"><div class="contents">9<div class="contents c2">a<span class="b">b</span>c</div></div></div>
112 <div class="contents c10"><div class="">10</div></div>
113 </div></div>
114
115 <div class="iflex"><div class="contents c2">
116 0
117 </div></div>
118 <div class="iflex"><div class="contents c2">
119 0
120 <div class="contents c1">1</div>
121 2
122 </div></div>
123 <div class="iflex"><div class="contents c2">
124 0
125 <div class="c1">1</div>
126 2
127 </div></div>
128 <div class="iflex c3">
129 0
130 <div class="contents c2"><div class="c1">1</div></div>
131 2
132 </div>
133 <div class="iflex c3">
134 <div class="contents c2">0</div>
135 <div class="contents c2"><div class="c1">1</div></div>
136 <div class="contents c2">2</div>
137 </div>
138 <div class="iflex c3">
139 <div class="inline">0</div>
140 <div class="contents"><div class="inline c1">1</div></div>
141 <div class="inline">2</div>
142 </div>
143
144 <ul><li class="c1"><div class="contents c2">
145 0
146 <div class="contents c1">x</div>
147 <div class="contents c1"><div class="contents c2">y</div></div>
148 <div class="contents c1"><div class="contents c2"><div class="">1<span class="b" >1</span></div></div></div>
149 <div class="contents c2"><div class="inline">2a<div class="">2<div class="conten ts c2">b<span class="b">b</span></div></div></div></div>
150 <div class="contents c3"><div class="inline">3</div></div>
151 <div class="inline"><div class="contents c4">4</div></div>
152 <div class=""><div class="contents c5">5a</div></div>
153 <div class=" c5">5b</div>
154 <div class="contents c6"><div class="">6</div></div>
155 <div class="ib"><div class="contents c7"><div class="contents c2">7<span class=" b">a</span></div></div></div>
156 <div class="contents c9"><div class="">8</div></div>
157 <div class="contents c9"><div class="contents">9<div class="contents c2">a<span class="b">b</span>c</div></div></div>
158 <div class="contents c10"><div class="">10</div></div>
159 </div></li>
160 </ul>
161
162 <div class="columns">
163 <div class="contents c1"><div class="contents c2"><div>1<span class="b">1</span> </div></div></div>
164 <div class="contents c2"><div>2</div></div>
165 <div class="contents c3"><div>3</div></div>
166 </div>
167
168 <div class="columns">
169 <div class="columns contents">
170 <div class="contents c1"><div class="contents c2"><div>1<span class="b">1</span> </div></div></div>
171 <div class="contents c2"><div>2</div></div>
172 <div class="contents c3"><div>3</div></div>
173 </div>
174 </div>
175
176 <div class="contents c3"><!-- comment node --></div>
177 <div class="contents c3"><?PI ?></div>
178
179 <span class="c2"><legend class="contents c1">Legend</legend><legend class="conte nts c1">Legend</legend></span>
180 <br clear="all">
181 <span class="c3">x<div class="contents c1" style="float:left">float:left</div></ span>
182 <span class="c3">y<div class="contents c1" style="position:absolute">position:ab solute</div></span>
183
184 <!-- Stuff below should simply ignore having display:contents -->
185
186 <fieldset class="contents c1"><legend class="contents">Legend</legend>fieldset</ fieldset>
187 <button class="contents c1">but<span>ton</span></button>
188 <select class="contents c1"><option>select</select>
189
190 </body>
191 </html>
OLDNEW
« no previous file with comments | « third_party/WebKit/LayoutTests/css-display-3/display-contents-td-001-expected.html ('k') | third_party/WebKit/LayoutTests/shadow-dom/slots-fallback-in-document-tree-expected.html » ('j') | third_party/WebKit/Source/core/dom/LayoutTreeBuilderTraversal.h » ('J')

Powered by Google App Engine
This is Rietveld 408576698