串联之间的空间

这个问题在这里已经有了答案：

如何去除内联块元素之间的空间？ 32个答案

---

我已经看到这个，并在之前回答：

经过进一步的研究，我发现inline-block是一种依赖于空白的方法，并且依赖于字体设置。 在这种情况下，4px被渲染。

为了避免这种情况，你可以运行所有的li S IN在一起一条线，或阻断的结束标记，并开始共同的标签是这样的：

<ul>
        <li>
            <div>first</div>
        </li><li>
            <div>first</div>
        </li><li>
            <div>first</div>
        </li><li>
            <div>first</div>
        </li>
</ul>

示例在这里。

---

正如其他答案和评论所提到的，解决此问题的最佳实践是添加font-size: 0; 到父元素：

ul {
    font-size: 0;
}

ul li {
    font-size: 14px;
    display: inline-block;
}

这对HTML可读性更好（避免将标签一起运行等）。 间距效果是由于字体的间距设置，所以您必须重置内联元素并为其中的内容重新设置它。

---

解：

ul {
    font-size: 0;
}

ul li {
    font-size: 14px;
    display: inline-block;
}

您必须将父字体大小设置为0

---

如下所示，我将添加float left的CSS属性。 这摆脱了额外的空间。

ul li {
    float:left;
}

链接地址: http://www.djcxy.com/p/29991.html

上一篇: A Space between Inline

下一篇: How do you easily horizontally center a <div> using CSS?