CSSハックは憶えるべき？？
0 user
0 user今日、右側にメニュー、左側にメインというシンプルなサイトのコーディングをしました。
全体の幅は800pxの左寄せ。
HTMLの書き方としては、やっぱり見出しがあって、その直下にメニューというのが好ましいと判断したので、まず見出し（h1）を書いて、その直下に右に来るメニューを書き、そのメニューの幅を200pxに指定して右側にフロート。そしてメインをdivでくるんで600pxに指定。
MacのIE、Opera、Firefox、NetScape、Safariでは問題なくレイアウトされました。
ところが問題はシェアNo.1のWin IE。。。
なぜかメニューの左側に回り込むはずのメインコンテンツがメニューの左下に。。。
「も〜！！なんでやねん！！」
メインコンテンツの中の幅600pxの画像を595pxにしたら左側に回り込む。この5pxは一体何者？？
もちろんimgにはborder:noneとしているので、ボーダーのせいではなさそうだし、特にmarginもpaddingも指定していない。
あれこれ考えているうちに、自然とWin IEのバグと回避方法を検索していました。
結局解決方法は見付からず、メインコンテンツを先に書いて、その下にメニュー。そしてメインコンテンツを左にfloat。
これでとりあえずは全てのブラウザで綺麗にレイアウトされたのですが、なんとも気持ちの悪いもので。。。ユーザーに優しくないし。。。
っちゅうか、このバグを回避する為のハックがあったとしても、それを憶える必要はあるのだろうか・・・？
素直にHTMLとCSSを書いているのだから素直に表示されて欲しいものです。
ハックを憶えたってブラウザがWeb標準に準拠したものにアップデートして、それが主流になれば一生懸命憶えたハックなんて水の泡。しかもIE7はいつになったら正式にリリースされるのかもわからないし、リリースされてもそれが一気に普及するとは考えにくい。
う〜む。。。バグが多いくせにシェアNo.1のWin IE、しっかりしてくれよ！！タチが悪すぎる！！
そしてバグの少ないFirefox！高性能なんだからもっと頑張ってくれよ！
僕はMacユーザーなのでよく知りませんが、どのメーカーのPC買っても標準でついてくるのはWin IEなんですよね？
PCメーカーの皆さん、コーダー泣かせのIEなんかじゃなくてFirefoxを標準搭載して下さい。
同じ悩みを抱えていらっしゃる方、回避方法をご存知の方がいらっしゃいましたらコメントお待ちしております。
トラックバックURL
http://snjweb.com/happy/web/css-hack001.html/trackback