IE6の後方互換モードでのブロック要素のセンタリング

CSS

XHTMLでは先頭にXML宣言をすることが求められる。UTF-8の場合は次のように。

<?xml version="1.0" encoding="UTF-8"?>

しかし、XML宣言をしてしまうとIE6では、DOCTYPE宣言が先頭にないために、そもそも宣言されていないことと見做されて後方互換モードになってしまう。こうなると、いろいろと弊害が発生する。その一つがブロック要素の水平方向のセンタリングの問題。たとえば、

<div class="block">
<!--ここにメインのコンテンツ-->
</div>

//以下、CSSの記述
div.block{
margin:0 auto;
width:800px;
}

通常はこの記述で、左右のマージンを自動的に同じだけとってdiv要素をセンタリングしてくれるのだが、IE6が後方互換モードになるとセンタリングしてくれない。ページのコンテンツ全体をセンタリングさせるのはよくある方法なので、これは大きな問題である。
手っ取り早い解決策としては、XML宣言をしないことである。事実、私も今までこの方法を取ってきた。だが、IE6のバグに合わせて精確な記述を枉げるのはいただけない。何より癪に障る。
そこでちょっと調べてみたら、CSSハックによる解決方法がある。

<div class="contents">
<div class="block">
<!--ここにメインのコンテンツ-->
</div>
</div>

//以下、CSSの記述
div.contents{
_text-align:center;
}
div.block{
margin:0 auto;
width:800px;
_text-align:left;
}

CSSの記述の前に_（アンダーバー）をつけるのは、文法に反しているので通常のブラウザでは無視されるが、IE6ではバグのためその行も反映される。
これで、XML宣言をしつつ、どのブラウザで見てもセンタリングされるようになる。
めでたしめでたし。