HTML・Wordpressなどの覚え書きブログ

リストタグを回り込みして横並びのメニューを作っていたときにブラウザごとで表示が異なったのでメモメモφ(.. )

IE7以降や、Firefox・Chrome・Sleipnir・Safari・Operaでは問題なかったのですが、IE6以下では、回り込みすらせず、親要素の幅まで広がってしまった。

横並びにしたいブロック要素の幅を固定にすれば問題は解決できるのですが、今回は使う人によってテキストの長さが変わるという状況であったため、幅は固定せずに実装したかった。

そこで<li>タグのdisplayプロパティにinline-blockを指定することで、テキストに応じた横幅の横並びメニューがIE6でも問題なく表示することができました。

Tag : 
Category:HTMLNo Comments
Copyright ホームページ覚書 All Rights Reserved.
Template by ホームページ覚書.