multicol-overflow-000

multi-column with set height causing overflow outside (basic)

WeasyPrint

Reference (good) by WeasyPrint

Reference (good) by this browser

This browser

Flags
ahem
Assertion
This test checks that column gap appears between two columns.

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: multi-column with set height causing overflow outside (basic)</title>
 5   <link rel="author" title="Hakon Wium Lie" href="mailto:howcome@opera.com">
 6   <link rel="reviewer" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/"> <!-- 2013-08-25 -->
 7   <link rel="help" href="http://www.w3.org/TR/css3-multicol/#pagination-and-overflow-outside-multicol" title="8.2. Pagination and overflow outside multicol elements">
 8   <link rel="match" href="reference/multicol-overflow-000-ref.htm">
 9   <meta name="flags" content="ahem">
10   <meta name="assert" content="This test checks that column gap appears between two columns.">
11   <style type="text/css">
12   div, table
13   {
14   background-color: yellow;
15   color: lime;
16   font: 1.25em/1 Ahem;
17   margin: 1em 0;
18   }
19 
20   div
21   {
22   columns: 2;
23   column-fill: balance;
24   column-gap: 0px;
25   height: 2em;
26   width: 20em;
27   }
28 
29   table
30   {
31   border-right: lime solid 1em;
32   border-spacing: 0px;
33   table-layout: fixed;
34   width: 21em;
35   }
36 
37   td {padding: 0em;}
38   </style>
39  </head>
40  <body>
41 
42   <p>Test passes if the 2 horizontal bars are <strong>identical</strong>.</p>
43 
44   <div id="test">A<br>B<br>C<br>D<br>E<br>F</div>
45 
46   <table id="reference"><tr><td>G<br>H</td><td>I<br>J</td></tr></table>
47 
48  </body>
49 </html>