css - 放大时如何强制 CSS 背景图像适合其包含的元素？

Question

我有一个无序列表（垂直显示），它使用背景图像在每个列表项中显示一个图形。

在用户缩放之前它看起来很好。一旦用户缩放，一些列表项的底部（内部）会出现一个微小的间隙。出现间隙是因为背景图像变得比列表项短，但两者都设置为相同的高度（44 像素）。

请参阅此示例。我为每个列表项添加了红色背景，以使差距更容易识别。尝试使用 Google Chrome 放大一次。

有没有办法消除缝隙？

我不能使用 background-size: cover 因为背景图像是精灵的一部分。

score 0 · Accepted Answer

0

将高度从 44 像素降低到 43 像素。这对我来说很明显，这对你的例子有帮助

于 2013-04-29T16:43:19.103 回答

score 0 · Accepted Answer

可能由于某些值舍入误差，Chrome<li>在放大时渲染 s 的方式不同，导致有些是 45px 高，有些是 44px。但是，一种解决方法是不在 li 上设置 height 和 line-height ，而是将其留给锚元素。

2 回答 2