html - img 的垂直对齐干扰 div 高度

标签 html css

<分区>

我在 <a> 中有一张 24x24 像素 的图像，嵌套在 <div> 中有min-height:50px .

<a> 的底部和顶部填充元素都是 13px。

因此，高度应为 24px(图像高度)+ 13px(<a> padding-top)+ 13px(<a> padding-bottom) = 50px 对吧？

问题是包装器 <div>正在将其高度扩展到 54px，除非我定义了 vertical-align:middle对于该图像，然后根据需要将其调整为 50px。

删除 vertical-align: middle;可能有助于理解问题

最佳答案

所有图片默认都是行内元素，底部有4px的空间。您应该在它们上设置 'vertical-align:top' 或 'display: block' 以删除此空间。

关于html - img 的垂直对齐干扰 div 高度，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/37681122/

相关文章：

html - xsl 聚合或子查询