首页 > 解决方案 > div元素在设置宽度为0后不折叠?

问题描述

请检查片段结果

<div style="border:1px solid black ; 
              height : 50px ;
              width:0 ; "></div>

检查后您会注意到控制台中元素的宽度显示为 0 。但是如果你看到自己的 div 没有折叠,那么左右边框之间会有一点空白。

我的问题是为什么在将内容宽度设置为 0 后左右边框之间会有一点空白?(注意:我不是想实现任何目标。我只是想更好地理解 CSS)

标签: css

解决方案


很确定你有一些干扰的地方。如果您剥离所有内容并仅使用以下代码(您的 div),您将只看到红色背景上的黑点。

<html><body style="background-color:red"><div style="border:1px solid black;height:0;width:0;"></div></body></html>

您在评论中提到您在 Chrome 的 div 内看到一个红色空间,这表明您在 Chrome 中有一个导致此问题的设置。也许清除缓存或重置 Chrome 会解决这个问题?


推荐阅读