ついにブロガーのメンバーになりました。これが私の最初のブログ投稿です。ul li content width_html/css_WEB-ITnose の問題と解決策について書きます。

ブログ記事を書くのは初めてです。私が遭遇した問題について書かせてください。

ul liについては、文字の長さが固定されておらず、1行に複数段表示されます。幅を指定すると、テキストの長さが指定された li width を超えます。 解決策:

以下のコード

オブジェクトを送信 (合計 10 メンバー)

• tester123456(tester12346@qq.com)


• tester12345(tester12345@qq.com)


• test12345(test12) 345 @ qq.com)


• willme(sdfsdf@sdf.com)


• willbin(sdfsd@22f.com)



• Taobao member_u_865b68p1g7(u_265i54w3n7@localhost.com)


• test

スタイル

.menber{width:754px; margin:0px auto;line-height:25px; max-height:200px;}

.menber li{clear:none;width:200px;float : left;height:25px;line-height:40px; margin-right:30px;}

このコードでは、すべてのメンバー情報が 1 行に 3 つ表示されますが、この行で問題が発生します。 .com) 幅は固定ですが、li の内容が 200px を超えており、内容に下線があり、その下線の後に数字または英語が続く場合、下線以降の内容が自動的に表示されます。改行表示に変更されましたが、liの高さが固定されているため、内容の行が下に落ちてしまいます

これにより、テキスト表示の幅を制御でき、きれいに配置できますが、li内のテキストが多すぎる場合, 200pxを超えると、中の内容が下の行に落ちてしまい、下の行の内容と重なってしまいますが、.menber liにoverflow:hidden;を追加すると、内容は落ちません。現時点ではどうすればよいでしょうか? 最善の解決策は、幅を指定せず、white-space:nowrap を追加することです (文字列が見つかった場合)。この問題は解決されていますが、幅が固定されていないため、すべてを完璧にするのは難しく、一部が失われます。より良い解決策があれば、それを共有してください。