body{
margin-left : expression(
document.body.clientWidth * 20 / screen.width + '%'
) ;
margin-right : expression(
document.body.clientWidth * 20 / screen.width + '%'
) ;
}
注:bodyセレクタ等文書中一つしかないようなものでないと使い物になりません(複数のセレクタに適用すると計算等に時間がかかる為)。Internet Explorer5 later限定。
特徴は例示すると次のようになる:
要はマージンの相対値が、ウィンドウ幅に比例してさらに相対的に変化するというもの。
800あるいは640ピクセルの場合にはもっと小さい数字であることが望ましい。つまりこう。左右マージンの値は:
これら全てに対して相対的に変化するべき。
この、「ウィンドウ最大化時左右マージン20%」という数字が、screen.width = 1024 の時に最適な数字であるとすれば:
body{
margin-left : expression(
document.body.clientWidth * screen.width / 50 / screen.width + '%'
) ;
margin-right : expression(
document.body.clientWidth * screen.width / 50 / screen.width + '%'
) ;
}
こうすると、例えば640*480の解像度の場合、左右のマージンは最大約12%ということになる。 多すぎか。もっと極端なカーブを描かないと駄目だな。
他、本文を一つのdiv要素にして、max-widthをemで指定するというのを考えた。左右マージンはautoで。だがこれは却下。余計なdivが増えるし、最適な一行文字数は決めたくない。