tableタグ卒業にむけて

サイトのデザインで目に見えないところをいじっています。具体的には、段組にtableタグをかなり使用していたんですが、それをやめてCSSにしようとしています。でも問題発生。

このサイトのおおまかなデザインは下のようなコードで実現できるはず(margin-left: auto; margin-right: auto;で中央揃えしたい)なのですが、ブラウザによっては中央にこないため、あいかわらずtableタグを使用しています。

<div style="margin-left: auto; margin-right: auto; width: 100%; height: auto;">
<div style="width: 200px; height: 100px;">BOX1</div>
<div style="width: 150px; height: 200px; float: left;">BOX2</div>
<div style="width: 50px; height: 200px; float: left;">BOX3</div>
</div>

↓表示例

BOX1
BOX2
BOX3

以前JavaScriptでも感じたことですが、クロスブラウジングを実現するのは本当に大鬼門です。

そうこうしているうちにいい解説サイト、発見しました!!

February 10, 2004 23:59 fenrir が投稿 : 固定リンク | | このエントリーを含むはてなブックマーク

コメント

コメントする