1

.lollipopを持っているクラスを持つ30の要素がありline-height: 30px; height: 30px;ます。

<a class="lollipop">Random text</a>
<a class="lollipop">Random text longer</a>
<a class="lollipop">Short</a>
...

動的な幅(通常のように、内部にあるテキストの量に基づいて幅が調整されます)を持ち、おそらく他のHTML要素を追加せずに、1行にこれらの要素を1つだけ持つようにCSSを作成するにはどうすればよいですか?

4

2 に答える 2

3

おそらく最も簡単な方法は次のとおりです。

a {
    float: left;
    clear: left;
}

これにより、HTMLを変更する必要がなくなります。

于 2012-06-21T17:10:47.920 に答える
0

display: table-rowすべてのリンクに同じ幅が必要な場合は、リンクの最大幅に合わせて柔軟な幅を計算してみてください。

または、デザインに問題が発生する場合に備えて、疑似で遊んで:before、フロートやクリアのないクリアのようなものを作成することもできます。

フィドル: http:
//jsfiddle.net/PhilippeVay/Sm8tK/

于 2012-06-21T17:18:01.377 に答える