Google chrome Chrome神秘地将页脚宽度增加了3倍

我的站点的页脚的宽度指定为960px，最大宽度也指定为960px。它在IE中看起来不错，但Chrome的宽度增加了3倍。为什么，我想不出来

以下是相关的CSS：

#colophon {
clear: both;
display: table;
width: 960px;
max-width: 960px;
background: #131313;
overflow: hidden;
border-top: 3px solid #0099cc;}

#colophon .widget {
display: table-cell;
float: left;
width: 22%;
margin: 2em 0 2em 2em;
background: #000;
color: #ccc;
text-align: justify;}

这不是小部件上的边距。我试过删除一个，所以只有三个小部件，22%宽，额外的3px仍然存在于Chrome中

---

我缺少什么？

删除显示：表格；规则这是不必要的，您不需要将其更改为任何其他内容，如display:block，因为这是默认设置，并且在示例中您不会覆盖它。

删除display:table；规则这是不必要的，您不需要将其更改为任何其他内容，如display:block，因为这是默认设置，并且在示例中您不会覆盖它。

尝试display:inline；编码代替显示：表格单元格；然后查看您是否已实现？？？

尝试显示：内联；编码代替显示：表格单元格；然后看看您是否实现了？？？

这似乎是webkit中的一个错误，要修复它，只需将页脚设置为显式折叠添加到页脚顶部的边框，如下所示：

#colophon {
 border-collapse: collapse;
}

确保删除溢出：隐藏声明，因为它不再需要了

编辑。是的，一只虫子。设法在这里重新创建它。与webkit中的OP问题相同。将提交错误报告

---

编辑2。已报告。

这似乎是webkit中的一个错误，要修复它，只需将页脚设置为显式折叠添加到页脚顶部的边框，如下所示：

#colophon {
 border-collapse: collapse;
}

确保删除溢出：隐藏声明，因为它不再需要了

编辑。是的，一只虫子。设法在这里重新创建它。与webkit中的OP问题相同。将提交错误报告

---

编辑2。报告。

有同样的问题，但现在我也使用最小宽度：960px；为什么在树脂上有展示台？如果您将其更改为display:block，至少在my Chrome最新版本上是有效的；规则？有同样的问题，但现在我也使用最小宽度：960px；为什么在树脂上有展示台？如果您将其更改为display:block，至少在my Chrome最新版本上是有效的；规则？这几乎解决了它！现在似乎只有1倍的额外宽度。如果只是在Chrome和一个Chrome bug中，我可以接受。@user1136475您可以使用媒体查询轻松地定位webkit浏览器，这样您就可以将页脚宽度设置为959px，直到bug解决为止。用这个来瞄准webkit浏览器safari和chrome@media screen和-webkit最小设备像素比：0{colophon{width:959px}}这几乎可以修复它！现在似乎只有1倍的额外宽度。如果只是在Chrome和一个Chrome bug中，我可以接受。@user1136475您可以使用媒体查询轻松地定位webkit浏览器，这样您就可以将页脚宽度设置为959px，直到bug解决为止。使用此选项可针对webkit浏览器safari和chrome@media screen和-webkit最小设备像素比：0{colophon{width:959px}}相同的问题。还是额外的1倍宽。边界坍塌也是这样，同样的问题。还是额外的1倍宽。这就是边框折叠。实际上，除了表格显示，任何东西都会破坏页脚布局。不知道为什么，但它删除了实际的页脚，并在内容下方浮动了小部件。在Firefox和Chrome中，我觉得没有任何显示声明就可以了。实际上，除了表显示之外，任何东西都会破坏页脚布局。不知道为什么，但它删除了实际的页脚，并在内容下方浮动了小部件。在Firefox和Chrome中，我觉得很好，没有任何显示声明。