OLD | NEW |
| (Empty) |
1 <html> | |
2 <head> | |
3 <style> | |
4 .container { | |
5 font-family: Ahem; | |
6 font-size: 10px; | |
7 } | |
8 | |
9 #content1 { | |
10 -webkit-flow-into: flow1; | |
11 } | |
12 | |
13 #content2 { | |
14 -webkit-flow-into: flow2; | |
15 } | |
16 | |
17 #content3 { | |
18 -webkit-flow-into: flow3; | |
19 } | |
20 | |
21 .region1 { | |
22 border: thick solid blue; | |
23 -webkit-flow-from: flow1; | |
24 } | |
25 | |
26 .region2 { | |
27 border: thick solid red; | |
28 -webkit-flow-from: flow2; | |
29 } | |
30 | |
31 .region3 { | |
32 border: thick solid green; | |
33 -webkit-flow-from: flow3; | |
34 } | |
35 | |
36 #region1 { | |
37 width: 500px; | |
38 } | |
39 | |
40 #region2 { | |
41 max-height: 101px | |
42 } | |
43 | |
44 #region3 { | |
45 max-height: 50px; | |
46 } | |
47 | |
48 #region4 { | |
49 max-height: 20px; | |
50 } | |
51 | |
52 #region5 { | |
53 max-height: 111px; | |
54 } | |
55 </style> | |
56 <script src="../../../resources/check-layout.js"></script> | |
57 </head> | |
58 <body onload="checkLayout('body div')"> | |
59 <p>Test for <a href="https://bugs.webkit.org/show_bug.cgi?id=111969">[CSS Re
gions] Nested auto-height regions don't layout correctly</a>.</p> | |
60 <div class="container" id="content1" data-expected-height=412>Lorem ipsum do
lor sit amet, consectetur adipiscing elit. Aenean urna orci, consequat sed lobor
tis in, convallis et velit. <div class="region3" id="region5" data-expected-heig
ht=121></div> Ut elementum lacus ac dui vestibulum eu condimentum mi luctus. Fus
ce pharetra turpis id erat congue nec aliquam leo venenatis. Cum sociis natoque
penatibus et magnis dis parturient montes, nascetur ridiculus mus.<div class="re
gion2" id="region2" data-expected-height=111></div>Class aptent taciti sociosqu
ad litora torquent per conubia nostra, per inceptos himenaeos. Sed egestas ultri
ces mauris sed tempor. Maecenas vitae libero ut nisl gravida eleifend blandit no
n risus.<div class="region2" id="region3" data-expected-height=50></div>Fusce gr
avida venenatis dolor eu imperdiet. | |
61 </div> | |
62 <div class="container" id="content2" data-expected-height=141>Ut at tortor l
igula. Cras tempor sem sed tellus convallis tincidunt eget eget dolor. In facili
sis ante at turpis semper semper. Fusce dui dolor, rhoncus et cursus in, malesua
da in justo. <div class="region3" id="region4" data-expected-height=30></div>Cur
abitur vulputate aliquet tincidunt. Quisque sit amet massa justo, in bibendum le
o. Aliquam lacinia pharetra justo. Suspendisse rhoncus justo nec diam cursus ull
amcorper. Nam porttitor porttitor libero, convallis sollicitudin nunc euismod at
. Proin tempus auctor turpis ut congue. Nullam ornare interdum eros sed suscipit
. | |
63 </div> | |
64 <div class="container" id="content3" data-expected-height=131>Sed nec justo
magna. Nullam accumsan arcu et enim blandit sagittis. In scelerisque, felis ac f
ermentum scelerisque, purus velit aliquet dui, non viverra eros eros vel sem. Ae
nean turpis lectus, molestie sodales adipiscing non, rhoncus eu justo. Nullam mo
lestie enim ac nulla cursus fringilla. Etiam sed metus lectus. Aliquam erat volu
tpat. Quisque pulvinar hendrerit urna non varius. Donec imperdiet, massa in semp
er hendrerit, urna nulla dapibus tellus, ac dignissim enim neque ut odio. In sag
ittis, est in fringilla accumsan, odio justo lacinia dui, sed pulvinar urna lore
m non dui.</div> | |
65 <div class="region1" id="region1" data-expected-height=422> | |
66 </div> | |
67 </body> | |
68 </html> | |
OLD | NEW |