OLD | NEW |
| (Empty) |
1 <!DOCTYPE html> | |
2 <html> | |
3 <head> | |
4 <title>CSS Test: flow-into on ordered and unordered list items</title> | |
5 <link rel="author" title="Mihai Balan" href="mibalan@adobe.com"> | |
6 <link rel="help" href="http://www.w3.org/TR/css3-regions/#properties-and
-rules" /> | |
7 <link rel="help" href="http://www.w3.org/TR/css3-regions/#the-flow-into-
property" /> | |
8 <link rel="stylesheet" type="text/css" href="../resources/font-smoothing
-disabler.css"> | |
9 <meta name="flags" content=""> | |
10 <meta name="assert" content="The flow-into property can be applied to in
dividual list items. List items extracted in named flows and flowed into regions
must preserve their list markers and numbering."> | |
11 <style> | |
12 ul > li { | |
13 -webkit-flow-into: uflow; | |
14 } | |
15 #r1 { | |
16 -webkit-flow-from: uflow; | |
17 } | |
18 ol > li { | |
19 -webkit-flow-into: oflow; | |
20 } | |
21 #r2 { | |
22 -webkit-flow-from: oflow; | |
23 } | |
24 .region { | |
25 width: 200px; | |
26 background-color: lightgray; | |
27 margin: 1em 2em; | |
28 } | |
29 </style> | |
30 </head> | |
31 <body> | |
32 <p>This test passes if there are two gray rectangles, each with a 4 item
s list in it.<br> | |
33 The first list should not be numbered and the second should be numbered,
starting at 1.<br> | |
34 Both the list markers for the first list and the numbers for the second
list should be outside of the gray rectangles. | |
35 </p> | |
36 <ul> | |
37 <li>Unordered list, item 1</li> | |
38 <li>Unordered list, item 2</li> | |
39 <li>Unordered list, item 3</li> | |
40 <li>Unordered list, item 4</li> | |
41 </ul> | |
42 <ol> | |
43 <li>Ordered list, item 1</li> | |
44 <li>Ordered list, item 2</li> | |
45 <li>Ordered list, item 3</li> | |
46 <li>Ordered list, item 4</li> | |
47 </ol> | |
48 <div id="r1" class="region"></div> | |
49 <div id="r2" class="region"></div> | |
50 </body> | |
51 </html> | |
OLD | NEW |