aタグ ブロック表示の回り込み【display: block;とfloat】

  • このエントリーをはてなブックマークに追加
  • はてなブックマーク - aタグ ブロック表示の回り込み【display: block;とfloat】
  • Share on Facebook
  • Post to Google Buzz
  • Bookmark this on Yahoo Bookmark
  • Bookmark this on Livedoor Clip
  • Share on FriendFeed

立て続けにCSSのメモをしてますが、最後に。

<ul>
<li><a href=”/”>a</a></li>
<li><a href=”/”>b</a></li>
<li><a href=”/”>c</a></li>
</ul>

なんて、メニューを横並びにa要素をブロック表示にして、floatで
回り込みさせるやり方で、これまたIE6の対応のために。

aタグに幅や高さを指定してfloatさせるんですが、aタグのCSSに
floatを指定するとIE6では階段状のように段々に下にずれていく。

解決策としては、aタグにdisplay: blockと幅高さ指定し、
liタグにfloatを指定する。こうすればIE6でもだいじょうぶ。

追記:

失礼しました。<ul><li>のみの現象でした。普通にaタグだけのソースなら
aタグにfloat CSSしても段々にずれることなくだいじょうぶでした。

<a href=”/”>a</a>
<a href=”/”>b</a>
<a href=”/”>c</a>

はてなブックマークに追加

コメントは受け付けていません。

★Macウィルス対策★ 最新版

Mac ソフトのことなら act2.com

★ネットセキュリティも万全。

Macでウィルス対策ソフトはコレだけだと思います。ウィルス駆除だけなく、今回のバージョンウイルスバリア X6は、ネットワークのバリアもファイアウォールも万全。Mac保護状態のインジケーターで確認、監視ツールで侵入経路をモニタリングすることもできます★