<!
DOCTYPE html >
<
link rel=
"author" title =
"Morten Stenshorne" href=
"mailto:mstensho@chromium.org" >
<
link rel=
"help" href=
"https://www.w3.org/TR/css-break-3/#unforced-breaks " >
<
link rel=
"help" href=
"https://www.w3.org/TR/CSS22/visuren.html#floats " >
<
link rel=
"help" href=
"https://www.w3.org/TR/CSS22/visuren.html#flow-control " >
<
link rel=
"match" href=
"../reference/ref-filled-green-100px-square.xht" >
<p>Test passes if there is a filled green square and <
strong >no red</
strong >.</p>
<
div style =
"width:100px; height:100px; background:red;" >
<
div style =
"columns:4; column-fill:auto; column-gap:0; height:150px;" >
<
div style =
"height:100px; background:green;" ></
div >
<
div style =
"float:right; break-inside:avoid; width:60%; height:400px;" >
<
div style =
"height:100px; background:green;" ></
div >
<
div style =
"height:50px;" ></
div >
<
div style =
"height:100px; background:green;" ></
div >
<
div style =
"height:50px;" ></
div >
<
div style =
"height:60px; background:green;" ></
div >
</
div >
<
div style =
"clear:left; float:left; width:40%; height:0;" >
<
div style =
"height:100px; background:green;" ></
div >
<
div style =
"height:50px;" ></
div >
<
div style =
"height:100px; background:green;" ></
div >
<
div style =
"height:50px;" ></
div >
<
div style =
"height:60px; background:green;" ></
div >
</
div >
<
div style =
"clear:both; display:flow-root; height:0;" >
<
div style =
"height:40px; margin-top:-40px; background:green;" ></
div >
</
div >
</
div >
</
div >
Messung V0.5 C=96 H=99 G=97
¤ Dauer der Verarbeitung: 0.1 Sekunden
(vorverarbeitet)
¤
*© Formatika GbR, Deutschland