inline-formatting-context-001

Inline formatting context and basic horizontal Layout

WeasyPrint

This browser

Assertion
Inline boxes are laid out horizontally or one after the other starting at the top of the containing block.

Source

 1 <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
 2 <html>
 3     <head>
 4         <title>CSS Test: Inline formatting context and basic horizontal Layout</title>
 5         <link rel="author" title="Microsoft" href="http://www.microsoft.com/">
 6         <link rel="help" href="http://www.w3.org/TR/CSS21/visuren.html#inline-formatting">
 7         <meta name="flags" content="">
 8         <meta name="assert" content="Inline boxes are laid out horizontally or one after the other starting at the top of the containing block.">
 9         <style type="text/css">
10             #div1
11             {
12                 border: solid 1px black;
13                 width: 600px;
14             }
15             div div
16             {
17                 display: inline;
18             }
19         </style>
20     </head>
21     <body>
22         <p>Test passes if all the words "Filler Text" are on the same line and they are contained by a black box.</p>
23         <div id="div1">
24             <div>Filler Text </div>
25             <div>Filler Text </div>
26             <div>Filler Text</div>
27         </div>
28     </body>
29 </html>