Warning: file_get_contents(/data/phpspider/zhask/data//catemap/3/html/75.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
Html Chrome搞乱了网站布局,FF和IE都不错_Html_Css_Layout_Google Chrome - Fatal编程技术网

Html Chrome搞乱了网站布局,FF和IE都不错

Html Chrome搞乱了网站布局,FF和IE都不错,html,css,layout,google-chrome,Html,Css,Layout,Google Chrome,我正在一个网站上工作: 它在FF和IE上表现得非常好。 我在Chrome上测试了一下,结果完全搞砸了。 不知何故,Chrome显示了彼此下方的所有div。 我真的不知道去哪里找,因为它在W3C验证器中也能很好地验证 也在谷歌上搜索过,但什么也找不到。有人知道答案吗? 请帮助。首先,如果您的HTML更易于阅读,那么它将非常有用 您在第41行打开了一个段落标记,也许这就是问题所在?您正在为div使用样式表第20行中的-moz box size来更改mozilla浏览器中框的计算大小。这在chrome

我正在一个网站上工作: 它在FF和IE上表现得非常好。 我在Chrome上测试了一下,结果完全搞砸了。 不知何故,Chrome显示了彼此下方的所有div。 我真的不知道去哪里找,因为它在W3C验证器中也能很好地验证

也在谷歌上搜索过,但什么也找不到。有人知道答案吗?
请帮助。

首先,如果您的HTML更易于阅读,那么它将非常有用


您在第41行打开了一个段落标记,也许这就是问题所在?

您正在为div使用样式表第20行中的-moz box size来更改mozilla浏览器中框的计算大小。这在chrome中无法识别

见:

您也可以使用webkit为浏览器应用修复程序:

div { box-sizing: border-box; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; } div{ 框大小:边框框; -moz框大小:边框框; -webkit框大小:边框框; }
在我看来,一个更好的方法是在没有这个解决方法的情况下让你的网站看起来很好,并根据你想要的大小减去填充物来计算你的盒子大小。

为firefox获取这个插件,它会告诉你你页面上的所有错误。。。包括Machiel提到的开放式标签

在CSS中,您有:

box-sizing: border-box;
-moz-box-sizing: border-box;   
要在WebKit(Chrome/Safari)中实现此功能,请使用
-WebKit框大小调整

-webkit-box-sizing: border-box;

我将完全删除这些框大小属性,并使用更符合要求的属性,如填充、边距、宽度和高度来进行大小调整

Chrome不支持框大小调整,这很烦人,因为它是CSS3的一部分


如果为DIV指定100%的边距,然后给它一个边框和5px的边距(例如),就会出现问题。将框大小设置为border box时,可以得到一个很好的缩进DIV。如果不调整框大小,DIV将溢出。现在,您可以通过使用包装器DIV来绕过它,但这是额外的标记,或者通过以像素为单位指定宽度,但如果您不知道宽度,这将不起作用。

它是否有效?FF倾向于在显示代码之前对其进行整理。要么您刚才对站点做了一些操作,要么布局有根本性的问题。我在FX3.6里查过了,那里也乱七八糟。如果该站点仅在IE中工作,这表明布局依赖于IE bug来按预期显示。我也找不到第41行打开的段落的结束标记。确保您的HTML是有效的并在类似的网站上进行测试是非常重要的。因此,在这个问题上没有像我为firefox找到的那样对chrome进行修复?如果您想继续使用此修复,请尝试使用:-moz box sizing:border box;框大小:边框框-webkit框大小:边框框;它不是P,我删除了它,它似乎选择在div的外部而不是内部添加填充