このブログは無料ブログツール、「Movable Type」で作っているのですが、私が今持っているスキル達を総動員してWEBデザイン＆サイト構築しています。
「企業サイトを越えるサイトを個人で運営できるのか？」を影のテーマに掲げ、一切妥協を許さないデザインと仕組みを構築していく予定です。...プロの方が読んだら笑う所かもしれません...。
私は、というか大抵の方がそうだと思いますが、まずサイトを作成する際には、最初に色々な決め事をしてからデザイン・構築に入っていきます。
特にコンテンツやレイアウト等を後で変更しようとすると、とてつもなく面倒くさいコトになりますので、この辺りは建物と一緒でサイトの設計図は非常に重要です。
今回のサイトは全体をどっしりと中央揃え（センダリング）にしようと計画をたてました。（右の画像はサイトの上部付近を拡大した作成当時の完成予想図）
ページを中央揃えにする事自体はCSSを書けば非常に簡単に出来るので、とりあえずCSSは以下のように記述しました。（太字の箇所がサイト全体を中央に寄せるための記述です。）
body {
width: 960px;
background-image: url(../img/all/bg_body.jpg);
background-repeat: repeat-y;
background-position: center top;
margin-right: auto;
margin-left: auto;
background-color: #f1f7e0;
}
ページ全体は960pxで、その外に展開する幅974×高さ1pxのグレイラインの外側が影（グラデーション）になる背景画像を用意（bg_body.jpg）、y軸（縦に）リピート、そんな感じで非常に簡単な記述で終了です。
しかし、いざこれをIE（インターネット・エクスプローラー）で確認すると、なんと画像がずれてる...。
これはイカン！...と、早速Googleで検索すると幾つか解決方法が公開されています。
次回には、それらの方法を試してバッチリ解決していきたいと思います。
