CSS 之谜：宽度设置为 0px 没有任何 CSS 规则？答案

【问题标题】：CSS mystery: Width being set to 0px without any CSS rules?CSS 之谜：宽度设置为 0px 没有任何 CSS 规则？
【发布时间】：2011-06-10 16:49:00
【问题描述】：

“匹配的 CSS 规则”中的顶部规则建议元素的宽度应为 160 像素。

但在“计算样式”中，宽度实际上是 0px。

如果您单击“0px”，它会再次显示规则，建议宽度应为 160px。但事实并非如此。

发生了什么事？什么将宽度设置为 0px 对 Chrome 开发者工具不可见？

我该如何调试呢？

【问题讨论】：

标签： css

【解决方案1】：

由于这是一个display: inline 元素，您无法设置它的宽度。试试display: inline-block。

【讨论】：

谢谢。知道我可以使用哪些工具来帮助我自己解决这类问题吗？
嗯，不是真的，google 是我要走的路。您可以阅读所有规范，但这会花费您很多时间。
@nightcracker、@AP257、CSS Spec 并不那么难以阅读。
没错，但 CSS 规范并不是唯一的规范 :)
这就是 CSS 令人沮丧的原因。我已经断断续续地使用它大约八年了。我读过 CSS 书籍。但是像这样的小规则仍然会让我感到困惑，除了询问 StackOverflow 之外，没有办法找出它为什么表现得如此奇怪......

【解决方案2】：

链接使用display: inline;。您需要display: inline-block; 或display: block;（如果您需要IE6-7 支持）。

【讨论】：

【解决方案3】：

它具有display: inline 属性，这使得元素忽略您的宽度、高度值，即使它们被标记为!important

【讨论】：