何かテンプレートを配布しているらしいですよ。奥さん。
あまり使えなさそうなメモ書きですが・・・、私自身が必要になったのでとりあえず残しておきます。
<div> <ul> <li>テスト</li> <li>テスト2</li> </ul> </div>
div {
text-align:center;
}
ul {
text-align: justify;
margin-left: auto;
margin-right: auto;
/* WindowsIE用margin */
_margin-left: 0;
_margin-right: 0;
}
普通、ボックスモデル要素をセンタリングする時は
ul {
margin-left: auto;
margin-right: auto;
}
と書きます。こうすることで左右のmarginの値が自動調節されセンタリングできます。
しかし、Windows IEの場合autoはこのような動作をしません。それどころかmarginの左右の値は、ulが本来持つmarginの値に戻されてしまいます。その結果、センタリングできません。
Windows IEでセンタリングするには、親要素のdivにtext-align:center;を適用します。
div {
text-align:center;
}
text-alignはインライン要素をセンタリングする時に使うものですが、Windows IEではバグがありボックスモデル要素もセンタリングできます。
最後にCSSハックを使ってWindows IEの場合のmarginの値を直します。
WindowsIEの場合、この作業を欠かすとリストが若干右にずれてしまいます。autoのバグによってmarginの左右の値がulの本来持つ値に戻されてしまっているからです。
ul {
/* WindowsIE用margin */
_margin-left: 0;
_margin-right: 0;
}
ここの値はWindows IEだけにしか適用されません。
Windows IEではプロパティの前に『_』を置いてもそれを読み飛ばしてしまうバグがありますが、それを利用したものです。
同じ問題で詰まってました。
助かりました!