multicol-rule-fraction-003

multicolumn | column-rule

WeasyPrint

Reference (good) by WeasyPrint

Reference (good) by this browser

This browser

Flags
ahem

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>multicolumn | column-rule</title>
 5 <link rel="author" title="Opera Software ASA" href="http://www.opera.com/">
 6 <link rel="help" href="http://www.w3.org/TR/css3-multicol/#column-gaps-and-rules">
 7 <link rel="match" href="reference/multicol-rule-fraction-3-ref.htm">
 8 <meta name="flags" content="ahem">
 9 <style type="text/css">
10 body {
11 	margin: 0;
12 }
13 body>div {
14 	font-family: ahem;
15 	font-size: 1em;
16 	line-height: 1em;
17 	color: black;
18 	background: yellow;
19 	margin: 1em;
20 	border: 1em solid gray;
21 	width: 14em;
22 	position: relative;
23 	orphans: 1;
24 	widows: 1;
25 
26 	column-count: 4;
27 	column-gap: 1em;
28 }
29 span {
30 	background: blue;
31 	position: absolute;
32 	top: 0;
33 	left: 2.4em;
34 	height: 2em;
35 	width: 1em;
36 }
37 span+span {
38 	left: 6.15em;
39 }
40 span+span+span {
41 	left: 9.9em;
42 }
43 </style>
44 </head>
45 
46 <body>
47 
48 <div>
49 	xx xx
50 <span>
51 </span>
52 	xx xx
53 <span>
54 </span>
55 	xx xx
56 <span>
57 </span>
58 	xx xx
59 </div>
60 
61 </body>
62 </html>