<分区>
HTML/CSS : div, anchor 和图像标签，下方有空格
请在将此标记为重复之前阅读完整帖子
我们都熟悉浏览器中烦人的默认代理样式表。我们可能还熟悉烦人的 anchor 和下面带有空格的图像标签。
所以这是我的问题:
HTML:
<div>
<a href="#">
<img src="src">
</a>
<a href="#">
<img src="src">
</a>
<a href="#">
<img src="src">
</a>
</div>
我出于测试目的使用了一些社交图标，它看起来像这样:
我希望 anchor 是一个正方形，所以在我的 CSS 中我只是说 a { display: inline-block; }
但是现在图像下面有一个空白，所以在我的 CSS 中我说 img { display: block }
带有 anchor 标签和图片标签的一切现在看起来都很好，但是......
现在 div 中有一个空白，没有任何证据表明它是 anchor 标记或图像标记。
您可能会想:“嗯，这很简单。只需在您的 CSS 中输入 div { font-size: 0 }”。那么这会导致另一个问题:div 不能很好地测量高度。它切掉顶部的一个像素:
所以如果有任何修复:如果没有丑陋的修复，我将如何解决这个问题:padding-top: 1px 或 margin-bottom: ...像素
如果没有修复:那会很奇怪
最佳答案
尝试添加 a { float:left } 或 a { vertical-align: middle }
关于HTML/CSS : div, anchor 和图像标签，下方有空格，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/45297183/