margin-boxとは
margin-box
とは、ボックスのサイズをmargin
も含めて計算するボックスのことです。
つまりmargin
が50pxで、width
が200pxなら、コンテントサイズは
200(width) - 50(margin-left) - 50(margin-right) = 100
になります。
ちなみにこのmargin-box
という値は、現在のbox-sizing
プロパティでは、有効な値ではありません。
でもcss3 shapesという仕様のshape-outside
というプロパティでは有効な値(それどころかデフォルト値)だったりします。
理由はよくわかりません。
nehan.jsにおけるbox-sizing
ところで nehan.js においては、box-sizing
にmargin-box
が指定できます。
というか、margin-box
がデフォルトです。なぜか。
それは、ページ送りの組版では、外側のサイズが固定されているからです。
通常のウェブサイトなら、外側のサイズは「スクロール」という組版に逃げることで、いくらでも拡張できます。
しかしページ送りの組版においては、外側のサイズは絶対です。
つまり内側のコンテンツは、外側に固定されたサイズを、何があってもはみ出さないように配置する必要があります。
そういう「外に余剰サイズを逃すことができない」状況下で、ボーダーの外側に余白を表現したい場合はどうするのか。
答えは簡単。コンテントサイズを削るしかありません。
だからnehan.jsのbox-sizing
は、基本的にmargin-box
なのです。
というか、paged mediaにおいては、そうならざるを得ないような気がします。