Html CSS Webkit错误-重画问题?

Html CSS Webkit错误-重画问题?,html,css,google-chrome,webkit,Html,Css,Google Chrome,Webkit,我创建了一个完全在FF和IE中工作的网站,但在基于webkit的浏览器中有一个bug,即Chrome 问题是画错了 但它看起来应该是这样的 然而,有趣的是,在Chrome的“开发者工具”窗口中,如果我轻推(例如取消选中并选中)任何元素的任何属性,浏览器将更新为正确的样式。如果我放大和缩小页面,它也是固定的 我能找到的唯一类似的问题是。我试图用这个方法解决我的问题,但没有成功。需要注意的是,我没有使用任何javascript在页面加载时动态更改样式(如上面的问题),它只是标准的HTML和CSS 我

我创建了一个完全在FF和IE中工作的网站,但在基于webkit的浏览器中有一个bug,即Chrome

问题是画错了

但它看起来应该是这样的

然而,有趣的是,在Chrome的“开发者工具”窗口中,如果我轻推(例如取消选中并选中)任何元素的任何属性,浏览器将更新为正确的样式。如果我放大和缩小页面,它也是固定的

我能找到的唯一类似的问题是。我试图用这个方法解决我的问题,但没有成功。需要注意的是,我没有使用任何javascript在页面加载时动态更改样式(如上面的问题),它只是标准的HTML和CSS


我认为这是webkit/chrome中的一个重画错误。有没有办法解决这个问题?

不确定这在技术上是否是一个bug,但肯定是一种奇怪的行为。您可以通过更改此部分来解决此问题:

#header_lower  ul li a{
box-sizing: border-box;
-ms-box-sizing: border-box; 
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;

…使用内容框而不是边框框。除非您的布局严重依赖于这些元素周围的厚边框,并且您无法对其进行补偿,否则这可能是一种方法。

您能给出示例代码吗?没有它很难测试:)这是答案,这是答案。抱歉,如果我没有按照正确的方式提交代码,那么,首先想到的是pastebin。这很有效!非常感谢你的帮助。绝对是奇怪的行为,你认为错误是因为我不正确地使用边框框,还是边框框在理论上应该按照我最初的意图运行?再次感谢!我想他们应该照你的意思做。我强烈怀疑有一个bug,但我对它的了解还不够,还不能把它称为bug:)现在我对它是否是bug还不太确定。。。将其缩小,发现还可以通过更改
#header#u lower ul li
选择器中的样式来修复它;将
padding:10px
更改为
margin:10px
。可能是在边框框大小的块中添加的填充物将单词挤到了“断点”。