フルCSSでサイトを構築する事が当たり前になりつつある今日この頃。
先ほどCSSでの落とし穴を見つけてしまいました。
よくサイト全体をセンタリングするテクニックがありますが、ここに落とし穴。
CSSを記述するときに一度html要素やbody要素のマージンやパディングをクリアーしてから書く人が多いと思うのですが、その行為が落とし穴です。
以下が、現象と回避策となっています。
「Netscapeでコンテンツ幅以下にブラウザを縮めると縮めた分左に隠れてしまう」という現象が起きてしまうらしいです。
解決方法はpaddingの設定を0以外にして、コンテンツの幅をbodyにも指定してあげます。
body {margin:0;padding:0 1px;width:700px;}
とりあえず下の例をネットスケープで見てもらえば分かると思います。
ちなみにNetscape7でもNetscape6でも同じ現象は起きます。
追記：
max-widthで100%指定をする方法でも回避ができるとの事。
こっちの方がスマートっぽいけど、max-widthを100%以外に設定するときはNGかな。。。 まぁそんなにないか