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: Horizontal Formatting</title>
5 <meta name="flags" content="ahem">
6 <link rel="help" href="http://www.w3.org/TR/REC-CSS1#horizontal-formatting">
7 <link rel="author" title="CSS1 Test Suite Contributors" href="http://www.w3.org/Style/CSS/Test/CSS1/current/tsack.html">
8 <link rel="author" title="Ian Hickson" href="mailto:ian@hixie.ch">
9 <style type="text/css">
10 p#ruled {
11 font: 40px/1 Ahem;
12 width: 360px; background-color: aqua; color: blue;
13 border-style: solid; border-color: fuchsia;
14 border-top-width: 0px; border-right-width: 40px; border-bottom-width: 0px; border-left-width: 40px;
15 padding-top: 0px; padding-right: 40px; padding-bottom: 0px; padding-left: 40px;
16 margin-top: 0px; margin-right: 40px; margin-bottom: 0px; margin-left: 40px;
17 }
18 </style>
19 <link rel="help" href="http://www.w3.org/TR/CSS21/box.html#box-dimensions" title="8.1 Box dimensions">
20 <link rel="help" href="http://www.w3.org/TR/CSS21/box.html#border-properties" title="8.5 Border properties">
21 <link rel="help" href="http://www.w3.org/TR/CSS21/box.html#padding-properties" title="8.4 Padding properties: 'padding-top', 'padding-right', 'padding-bottom', 'padding-left', and 'padding'">
22 <link rel="help" href="http://www.w3.org/TR/CSS21/box.html#margin-properties" title="8.3 Margin properties: 'margin-top', 'margin-right', 'margin-bottom', 'margin-left', and 'margin'">
23 </head>
24 <body>
25 <p>The two diagrams below should be identical.</p>
26 <div class="test">
27 <p id="ruled">X X X X X</p>
28 <p id="control">
29 <img src="support/css1test412a.png" alt="The diagram above should be as described here: A 40px white square (which will appear as a 40px indent from the left margin), a 40px fuchsia square, six 40px aqua squares separated by five 40px blue squares, and a final fuchsia square.">
30 </p>
31 </div>
32 </body>
33 </html>