このフィドルhttps://jsfiddle.net/rpep00dg/7/では、コンテンツの前に Chrome の空の列が追加されます。Firefox または Safari でフィドルを開くと、「ヘッダー」の前に空の列はありません。p
これは、最初の要素がタグのようなブロック レベルの要素である場合に当てはまります。
これはどこかに文書化されている Chrome のバグですか? また、Firefox や Safari のようにレンダリングするための回避策はありますか?
section {
page-break-inside: avoid;
margin-bottom: 10px;
}
html {
height: 100%;
}
body {
column-count: 2;
column-gap: 36px;
width:100%;
height: 100%;
column-fill: auto;
}
<section>
<h1>Header</h1>
<section>
lsdkfj sljfsdl fdsljfs;lkafjslf sa;lfjsl flsdkfj sljfsdl fdsljfs;lkafjslf sa;lfjsl flsdkfj sljfsdl fdsljfs;lkafjslf sa;lfjsl flsdkfj sljfsdl fdsljfs;lkafjslf sa;lfjsl flsdkfj sljfsdl fdsljfs;lkafjslf sa;lfjsl flsdkfj sljfsdl fdsljfs;lkafjslf sa;lfjsl flsdkfj sljfsdl fdsljfs;lkafjslf sa;lfjsl f
</section>
<section>
lsdkfj sljfsdl fdsljfs;lkafjslf sa;lfjsl flsdkfj sljfsdl fdsljfs;lkafjslf sa;lfjsl flsdkfj sljfsdl fdsljfs;lkafjslf sa;lfjsl flsdkfj sljfsdl fdsljfs;lkafjslf sa;lfjsl flsdkfj sljfsdl fdsljfs;lkafjslf sa;lfjsl flsdkfj sljfsdl fdsljfs;lkafjslf sa;lfjsl flsdkfj sljfsdl fdsljfs;lkafjslf sa;lfjsl f
</section><section>
lsdkfj sljfsdl fdsljfs;lkafjslf sa;lfjsl flsdkfj sljfsdl fdsljfs;lkafjslf sa;lfjsl flsdkfj sljfsdl fdsljfs;lkafjslf sa;lfjsl flsdkfj sljfsdl fdsljfs;lkafjslf sa;lfjsl flsdkfj sljfsdl fdsljfs;lkafjslf sa;lfjsl flsdkfj sljfsdl fdsljfs;lkafjslf sa;lfjsl flsdkfj sljfsdl fdsljfs;lkafjslf sa;lfjsl f
</section><section>
lsdkfj sljfsdl fdsljfs;lkafjslf sa;lfjsl flsdkfj sljfsdl fdsljfs;lkafjslf sa;lfjsl flsdkfj sljfsdl fdsljfs;lkafjslf sa;lfjsl flsdkfj sljfsdl fdsljfs;lkafjslf sa;lfjsl flsdkfj sljfsdl fdsljfs;lkafjslf sa;lfjsl flsdkfj sljfsdl fdsljfs;lkafjslf sa;lfjsl flsdkfj sljfsdl fdsljfs;lkafjslf sa;lfjsl f
</section><section>
lsdkfj sljfsdl fdsljfs;lkafjslf sa;lfjsl flsdkfj sljfsdl fdsljfs;lkafjslf sa;lfjsl flsdkfj sljfsdl fdsljfs;lkafjslf sa;lfjsl flsdkfj sljfsdl fdsljfs;lkafjslf sa;lfjsl flsdkfj sljfsdl fdsljfs;lkafjslf sa;lfjsl flsdkfj sljfsdl fdsljfs;lkafjslf sa;lfjsl flsdkfj sljfsdl fdsljfs;lkafjslf sa;lfjsl f
</section><section>
lsdkfj sljfsdl fdsljfs;lkafjslf sa;lfjsl flsdkfj sljfsdl fdsljfs;lkafjslf sa;lfjsl flsdkfj sljfsdl fdsljfs;lkafjslf sa;lfjsl flsdkfj sljfsdl fdsljfs;lkafjslf sa;lfjsl flsdkfj sljfsdl fdsljfs;lkafjslf sa;lfjsl flsdkfj sljfsdl fdsljfs;lkafjslf sa;lfjsl flsdkfj sljfsdl fdsljfs;lkafjslf sa;lfjsl f
</section><section>
lsdkfj sljfsdl fdsljfs;lkafjslf sa;lfjsl flsdkfj sljfsdl fdsljfs;lkafjslf sa;lfjsl flsdkfj sljfsdl fdsljfs;lkafjslf sa;lfjsl flsdkfj sljfsdl fdsljfs;lkafjslf sa;lfjsl flsdkfj sljfsdl fdsljfs;lkafjslf sa;lfjsl flsdkfj sljfsdl fdsljfs;lkafjslf sa;lfjsl flsdkfj sljfsdl fdsljfs;lkafjslf sa;lfjsl f
</section><section>
lsdkfj sljfsdl fdsljfs;lkafjslf sa;lfjsl flsdkfj sljfsdl fdsljfs;lkafjslf sa;lfjsl flsdkfj sljfsdl fdsljfs;lkafjslf sa;lfjsl flsdkfj sljfsdl fdsljfs;lkafjslf sa;lfjsl flsdkfj sljfsdl fdsljfs;lkafjslf sa;lfjsl flsdkfj sljfsdl fdsljfs;lkafjslf sa;lfjsl flsdkfj sljfsdl fdsljfs;lkafjslf sa;lfjsl f
</section>
</section>