[LFC][Floats] Add support for placing formatting roots in-between floats.
[WebKit-https.git] / LayoutTests / fast / block / block-only / floats-and-block-formatting-roots.html
1 <style>
2 .container {
3         width: 300px;
4         height: 100px;
5 }
6
7 .float {
8         background-color: blue;
9 }
10
11 .root {
12         overflow: hidden;
13         background-color: red;
14 }
15 </style>
16
17 <div class=container>
18 <div class=float style="float: left; width: 100px; height: 20px;"></div>
19 <div class=float style="float: right; width: 110px; height: 20px;"></div>
20 <div class=float style="float: left; width: 200px; height: 20px;"></div>
21 <div class=float style="float: right; width: 110px; height: 20px;"></div>
22 <div class=root style="width: 90px; height: 20px;"></div>
23 </div>
24
25 <div class=container>
26 <div class=float style="float: left; width: 100px; height: 20px;"></div>
27 <div class=float style="float: right; width: 110px; height: 20px;"></div>
28 <div class=float style="float: left; width: 200px; height: 20px;"></div>
29 <div class=float style="float: right; width: 110px; height: 20px;"></div>
30 <div class=root style="width: 100px; height: 20px;"></div>
31 </div>
32
33 <div class=container>
34 <div class=float style="float: left; width: 100px; height: 20px;"></div>
35 <div class=float style="float: right; width: 110px; height: 20px;"></div>
36 <div class=float style="float: left; width: 200px; height: 20px;"></div>
37 <div class=float style="float: right; width: 110px; height: 20px;"></div>
38 <div class=root style="width: 190px; height: 20px;"></div>
39 </div>
40
41 <div class=container>
42 <div class=float style="float: left; width: 100px; height: 20px;"></div>
43 <div class=float style="float: right; width: 110px; height: 20px;"></div>
44 <div class=float style="float: left; width: 200px; height: 20px;"></div>
45 <div class=float style="float: right; width: 110px; height: 20px;"></div>
46 <div class=root style="width: 300px; height: 20px;"></div>
47 </div>