-
Notifications
You must be signed in to change notification settings - Fork 708
/
Copy pathformatting-model-example.xht
98 lines (84 loc) · 4.4 KB
/
formatting-model-example.xht
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>CSS Test: height:auto on region box</title>
<link rel="author" title="Vincent Hardy, Adobe Systems" href="mailto:vhardy@adobe.com" />
<link rel="help" href="http://dev.w3.org/csswg/css3-regions/#rfcb-height-computation" />
<link rel="match" href="regions-auto-size-1-ref.xht" />
<meta name="flags" content="" />
<meta name="assert" content=
"The height of a region with height:auto is computed from the fragment content" />
<style>
/*<![CDATA[*/
#article {
-webkit-flow-into: article;
color: black;
margin: 0px;
padding: 0px;
}
#article p {
margin: 0;
}
#main-flow {
color: #a0a0a0;
margin-right: 1em;
}
#rA, #rB, #rC {
-webkit-flow-from: article;
height: auto;
border-radius: 0.5em;
margin: 1em 1em 0em 1em;
padding: 1em;
border: 3px solid #46A4E9;
}
#rA {
width: 90.5%;
height: auto;
}
#rB {
float: left;
width: 15em;
height: 150px;
max-height: 150px;
}
#rC {
width: 12em;
height: 610px;
float: right;
}
#main-flow {
padding: 0em 1em 0em 1em;
}
/*]]>*/
</style>
</head>
<body>
<div id="article">
<p style="-webkit-region-break-after:always;">I am not a plane Figure, but a Solid. You call me a Circle; but in reality I
am not a Circle,</p><p>but an infinite number of Circles, of size varying from a
Point to a Circle of thirteen inches in diameter, one placed on the top of
the other. When I cut through your plane as I am now doing, I make in your
plane a section which you, very rightly, call a Circle. For even a Sphere -
which is my proper name in my own country - if he manifest himself at all to
an inhabitant of Flatland - must needs manifest himself as a Circle.</p>
<p>Square and triangular houses are not allowed, and for this reason. The
angles of a Square (and still more those of an equilateral Triangle,) being
much more pointed than those of a Pentagon, and the lines of inanimate
objects (such as houses) being dimmer than the lines of Men and Women, it
follows that there is no little danger lest the points of a square or
triangular house residence might do serious injury to an inconsiderate or
perhaps absent-minded traveller suddenly therefore, running against them:
and as early as the eleventh century of our era, triangular houses were
universally forbidden by Law, the only exceptions being fortifications,
powder- magazines, barracks, and other state buildings, which it is not
desirable that the general public should approach without circumspection.</p>
</div>
<div id="rA"></div>
<div id="rB"></div>
<div id="rC"></div>
<div id="main-flow">
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus orci mi, feugiat quis feugiat imperdiet, scelerisque et sem. Vivamus nec nisi sit amet risus elementum rutrum sed ac mi. Curabitur sapien nulla, dictum eu consectetur et, pulvinar ut ipsum. Nullam non purus non nibh aliquet tincidunt a nec est. Ut vitae libero eu dolor ullamcorper pharetra. Curabitur consequat, felis a fringilla varius, lectus turpis auctor enim, id lacinia tellus lacus at sem. Etiam bibendum nibh vitae purus vestibulum molestie. Phasellus tristique purus eget nisi euismod et feugiat est imperdiet. Phasellus laoreet turpis malesuada nisi sollicitudin scelerisque.</p>
<p>Morbi imperdiet, massa ac molestie lacinia, tortor sapien ornare quam, quis luctus nisl est et purus. Cras vel odio felis, ut rhoncus urna. Maecenas ut quam eu est vehicula feugiat. Praesent eget leo augue, vel tincidunt mauris. Maecenas accumsan, velit dictum sagittis imperdiet, elit velit gravida ligula, in pulvinar velit libero ac nibh. Mauris eget rhoncus magna. Donec ultricies massa tortor, nec euismod nibh. Sed a nibh mauris, venenatis gravida nisl. Cras neque metus, vulputate et cursus non, ultricies sit amet metus. Praesent vestibulum lacinia gravida. Nunc eget nulla quis tellus consectetur aliquam in quis purus. Sed nec turpis vel leo vehicula vulputate ac at diam. Aenean at turpis non enim viverra faucibus a in massa. Donec et dui a leo scelerisque luctus. Cras in justo a mauris hendrerit faucibus.</p>
</div>
</body>
</html>