css - CSSでミッドリンクワードラップを回避するにはどうすればよいですか？

Question

ナビゲーション領域にアイテムのリストが水平に表示されていますが、リンクの途中でこのように折り返されています

| This is Item One | This is Item Two | This is Item Three | This is
Item Four | This is Item Five |

このようにラップしたいとき：

| This is Item One | This is Item Two | This is Item Three  
| This is Item Four | This is Item Five |

whitespace: nowrapリンクアイテム（li a）で宣言を使用しようとしましたが、2番目の（折り返された）行が完全に消えてしまいます。

score 15 · Accepted Answer

私はあなたが探しているのは空白のプロパティだと思います：

.menu a {
    white-space: nowrap;
}

別のオプションは、固定幅を割り当て、各メニュー項目を左側にフロートさせることです。

.menu a {
    display: block;
    float: left;
    width: 200px;
}

もちろん、CSSはHTMLによって異なります。メニューを順序付けられていないリストに入れ、これらのスタイルをリストアイテムに適用することをお勧めします。

score 5 · Accepted Answer

あなたのスタイルやマークアップを自由に使えるようにすることなく、これは私が解決策として提供できる最高のものです（あなたの問題が正確に何であるかについては大げさな推測です）：

あなたがする必要があるdisplay:inline-blockのは適切な<a>タグに適用することです。

3 に答える 3