ログインしてさらにmixiを楽しもう

コメントを投稿して情報交換!
更新通知を受け取って、最新情報をゲット!

CSSテクニックコミュのwinIE5.0でリストの途中で折り返される事について

  • mixiチェック
  • このエントリーをはてなブックマークに追加
初めまして。CSSを勉強中の者です。
色々自分なりに調べてみたんですが、どうしてもわからなかったので、質問させていただきます。

添付画像のようにwin版IE5.5、6ではwhite-space:nowrap;を使えばリストの途中で折り返されないんですが、win版IE5.0だとリストの途中で折り返されてしまいます。

途中で折り返されないようにするにはどうしたらいいのでしょうか?

ご存知の方がいましたら、どうか教えてください。
よろしくお願いします。

↓下記のHTMLソースを使用しています。

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<style type=text/css>
ul#list{
white-space:nowrap;
background-color:#F2F0EC;
width:518px;
list-style:none;
margin: 0.5em 0 0 0;
padding: 8px;
float:left;
}

ul#list li.list01{
white-space:nowrap;
list-style:none;
margin: 0 8px 0 0;
padding: 0;
float:left;
}
</style>
</head>
<body>
<ul id="list">
<li class="list01">メニュー1</li>
<li class="list01">メニュー2</li>
<li class="list01">メニュー3</li>
<li class="list01">メニュー4</li>
<li class="list01">メニュー5</li>
<li class="list01">メニュー6</li>
<li class="list01">メニュー7</li>
<li class="list01">メニュー8</li>
<li class="list01">メニュー9</li>
<li class="list01">メニュー10</li>
<li class="list01">メニュー11</li>
</ul>
</body>
</html>

コメント(2)

win版IE5.0はwhite-space:nowrap;に対応していません。

ですので柔軟性はなくなりますが<ul>に内包する<li>以上のwidthを指定するのが手っ取り早くはあるかなぁ、と思います。

ちょっと今時間がないので根本的解決に至らなくてすいません。取り急ぎnowrapの件だけ。
>ナナさん
やはりwin版IE5.0はwhite-space:nowrapに対応してないんですね。

とりあえずwidthを指定してやってみます。
どうもありがとうございました。

ログインすると、みんなのコメントがもっと見れるよ

mixiユーザー
ログインしてコメントしよう!

CSSテクニック 更新情報

CSSテクニックのメンバーはこんなコミュニティにも参加しています

星印の数は、共通して参加しているメンバーが多いほど増えます。