multicol-columns-002

columns shorthand (basic)

WeasyPrint

Reference (good) by WeasyPrint

Reference (good) by this browser

This browser

Flags
ahem
Assertion
This test checks that 'columns: 6 100px' shorthand correctly set 'column-width' and 'column-count' properties.

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 Multi-column Layout Test: columns shorthand (basic)</title>
 5   <link rel="author" title="Opera Software ASA" href="http://www.opera.com/">
 6   <link rel="reviewer" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/"> <!-- 2013-07-25 -->
 7   <link rel="help" href="http://www.w3.org/TR/css3-multicol/#the-number-and-width-of-columns" title="3. The number and width of columns">
 8   <link rel="match" href="reference/multicol-columns-001-ref.htm">
 9   <meta name="flags" content="ahem">
10   <meta name="assert" content="This test checks that 'columns: 6 100px' shorthand correctly set 'column-width' and 'column-count' properties.">
11   <style type="text/css">
12   body {width: 600px;}
13 
14   div
15   {
16   background-color: yellow;
17   color: black;
18   font: 1.25em/1 Ahem;
19   orphans: 1;
20   widows: 1;
21 
22   columns: 6 100px;
23   column-gap: 0;
24   }
25   </style>
26  </head>
27  <body>
28   <div>
29 	d da dam dame damer
30 	d da dam dame damer
31 	d da dam dame damer
32 	d da dam dame damer
33 	d da dam dame damer
34 	d da dam dame damer
35 	d da dam dame damer
36 	d da dam dame damer
37 	d da dam dame damer
38 	d da dam dame damer
39 	d da dam dame damer
40   </div>
41  </body>
42 </html>