Question

当你缩小这个网站：https://www.zm-online.de/时，它打破了顶级导航：PC：FF，Chrome，Safari（在IE9上很好）在MAC上：Chrome和Safari（在FF上很好）

我正在考虑将其修改为第598行并将填充更改为：25到20，因此代码将如下所示：

av#main_navi ul li a b.n2{
background: url("../_img/bg/mainnavi/bg_navi.jpg") repeat-x scroll 0 0 transparent;
color: #444;
font-weight: bold;
text-transform: uppercase;
height: 37px;
line-height: 37px;
/*padding: 0 19px;*/
/*padding: 0 25px;*/
padding: 0 20px;
text-align: center;

}

然而，这不适用于使用Safari和Chrome的PC和MAC，并且它使得顶级导航在“正常”视图中看起来不太正确。任何帮助，将不胜感激。：-）谢谢！丽塔

Answer 1

您可以尝试将填充设置为％。希望这会有所帮助。

Answer 2

嘿，这不是一个好的解决方案，但如果您将font-size更改为10px，导航不会在Firefox上中断。

将float提供给li会给我带来一些问题。我使用display:inline-block作为水平菜单，display:inline-block可以使用IE，FF，但当缩放级别为33％或25％时，Chrome会出现一些错误。

在我看来，尝试使用display:inline-block设计此导航。

缩小打破顶部导航

2 个答案: