質問: - で改行する横並びのメニュー * を使って横並びのメニューを作っています。項目が増えると横幅いっぱいになるためメニューが2行になるのですが、項目の途中で改行されて困っています。 │●リンクa ●リンクb ●リンクc ●リン│←ページ右端 │クd ●リンクe 項目の途中で改行せずに↓こうしたいと考えています。 │●リンクa ●リンクb ●リンクc │←ページ右端 │●リンクd ●リンクe リストタグを使わずに で改行を入れる方法は使いたくありません。いい方法をご存知の方がいましたら教えてください。よろしくお願いします。
回答: 難しく考えすぎ。単純に改行されたくなければ、幅固定が一般的だけど、文字数で幅がかなり違う場合には、ブロックにして li や a 内に限り改行禁止にする。 li{ display:block } が一般的。 あとは、アンカーの前後に文字が付属する場合なら li{ white-space: nowrap; } li a{ display:block;} こうやれば、 li や a を margin,paddingで調整。border で囲ったり background や color で色々出来る。 また、この場合、 ブラウザでフォントサイズのみを大きく変更された場合に、段落が増えるのでリンクメニューの順序も多少考慮し標準サイズで右側が短い文章の項目になるようにデザインも考慮しなければいけない。