Question

我有30个元素，其中.lollipop类有line-height: 30px; height: 30px;。

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

如何编写具有动态宽度的CSS（它们的宽度根据它们内部有多少文本进行调整，就像通常那样）并且每行只有一个这样的元素，可能没有添加其他HTML元素？< / p>

Answer 1

可能最简单的方法是：

a {
    float: left;
    clear: left;
}

有了这个，您就不必更改HTML。

Answer 2

如果您想要所有链接的宽度相等，则可以尝试display: table-row，灵活的宽度计算为链接的最大宽度。

或者您可以使用:before伪来创建一个没有浮动且清晰的清晰，以防它在您的设计中出现问题。