Question

Link

问题出在jQuery Mega菜单中。它以某种方式在Google Chrome Linux和Internet Explorer（Windows 8）上正确显示，但在Opera（Linux），谷歌浏览器（Windows），Firefox（Windows）等上显示不正确。如果显示不正确，最后一个菜单悬停覆盖搜索时输入。这可能是什么问题？我不想改变填充。

Answer 1

差异很可能是由于浏览器以不同方式解释小数像素数。每个菜单项都没有通过CSS设置明确的宽度，因此它获得了一些在一些中被尊重的像素的一小部分。现在，每个元素只能产生1px的差异，但最终会增加10px，20px等等。

因此，解决方案是在菜单项和搜索栏之间留出足够的空间，或者使其更窄。

这可能会帮助您详细了解问题： Are the decimal places in a CSS width respected?

Answer 2

不知道是不是正确的方法

您的CSS文件中有一些代码在2025行

#searchform {
    position: absolute;
    top: 79px;
    left: 744px;
    width: auto;
    height: auto;
    margin: 0px;
    display: table-cell;
}

从left

修改764px属性值为744px;

和第3416行

#searchform .text_input {
    width:149px;
    height: 9px;
    padding: 10px;
    position: relative;
    top: -1px;
    vertical-align: middle;
    font: 11px Arial,sans-serif;
}

从此代码块中删除width属性

为什么这个网站在不同的浏览器中显示不同宽度的菜单？

2 个答案: