dポイントプレゼントキャンペーン実施中!

リストをcssでフロートで横並びにした場合の話ですが、
たとえば、項目が5つあって、liのwidthを指定せずに500pxのボックスの中に横並びにすると、5つの合計の幅が500pxでおさまる場合は問題ないのですが、おさまらない場合、IEで項目の途中で改行されてしまいます。
li { white-space: nowrap; } で改行させないようにすることはできるのですが、これだと、1項目の中身が500pxを超えてしまうような長文の場合、逆に突き抜けてしまい困っております。
何かよい方法があればご教授いただけると助かります。

A 回答 (1件)

改行させないで、つきぬけないならどうしたいのでしょう?


その辺を書かないと、命題が矛盾してしまいます

おそらくoverflow:hidden的な解決方法を希望しているのだとは
思いますが・・・

この回答への補足

説明不足で申し訳ありません。。。
つまり、上の例ですと、li { white-space: nowrap; } なら、5つあるli要素の合計が500pxを超える場合はli要素単位で下に落ちるのでのですが、↓
【li要素1】 【li要素2】 【li要素3】
【li要素4】
ひとつのli要素だけで500pxを超えるような長文の場合、li要素内では改行しないので、
【li要素1li要素1li要素1li要素1li要素1li要素1li要素1li要素1】
↑のように突き抜けてしまうので、↓のように改行するようにしたいのです。その場合、li { white-space: nowrap; }は使えないと思うので何か良い方法があれば と思ったわけです。
【li要素1li要素1li要素1li要素1li要素
1li要素1li要素1li要素1】
【li要素2li要素2li要素2li要素2li要素
2li要素2li要素2li要素2】

補足日時:2009/06/23 13:53
    • good
    • 0

お探しのQ&Aが見つからない時は、教えて!gooで質問しましょう!