如何修复firefox和chrome中的空间？

Posted 2023-03-06

【中文标题】如何修复firefox和chrome中的空间？

【英文标题】：How to fix the space in firefox and chrome?

【发布时间】：2015-07-02 16:26:30

【问题描述】：

我做的网站用chrome打开还是不错的，但是用firefox打开时菜单和内容之间有空格。 This is the website。你知道如何解决吗？本网站是在 WordPress 上开发的。所以我不知道如何解决它。 谢谢..

【问题讨论】：

如果您将 html 粘贴到此处会很有帮助。好像你可能错过了某个地方的标签

我是wordpress网站的新手，不知道html文件在哪里

你只能定位 mozilla 浏览器..

【参考方案1】：

它在 Mozilla 和 chrome 中看起来不错

<div style="overflow:hidden" class="container">

或者您可以使用

仅定位 mozilla

 <style type="text/css">
    @-moz-document url-prefix() 

.containeroverflow:hidden  

    
    </style>

【讨论】：

我可以在我的主 CSS 中使用第二个吗？因为该网站使用 Wordpress，如果我制作一个新的 css 文件，我不知道如何在网站中调用该 css。

@hendraspt，只需在主 css 文件的现有容器类中添加溢出：隐藏。或者你可以在你的主css文件中添加第二种方法并清除缓存并测试它。

这很有效，但是滑块下方的内容在顶部被剪切了一点。我试图将另一个代码更改为@-moz-document url-prefix() #primary-mono #main margin-top: -80px;，但它在 Firefox 中不起作用。

【参考方案2】：

我认为问题在于 Firefox 将内容向下推以便为滑块中的图像腾出空间。脚本启动并重新设置滑块的样式后，Firefox 不会自动将页面上的内容移动到其预期位置。

尝试设置：

   #sliderdiv overflow: hidden;

【讨论】：

什么是英雄框架？我应该把它放在哪里？

这里 hero-frame 指的是slider的div。

【参考方案3】：

我尝试用 firebug 修复它，这段代码使它在 Firefox 中看起来不错：

#site-navigation  margin-bottom: 0px; 
#slider-wrapper  margin-top: 0px; 

【讨论】：

它只在 Firefox 的主页中看起来不错，但在 chrome 和 Firefox 和 chrome 的另一个页面/菜单中没有

【参考方案4】：

放 overflow: hidden; 在<div class="container"> 中，它会成功的。在 Chrome 中观看时，这不会刹车。

【讨论】：

嗯，它适用于 chrome 和 firefox，但只能在主页中，在另一个页面/菜单（如“advisory”）中，firefox 和 chrome 中有一个空格

【参考方案5】：

首先在你的容器类中添加这个属性

.container 
    display: inline-block;

比减少底部边距

#top-nav #site-navigation 
    margin-bottom: 42px;

按预期完美运行。

【讨论】：

我很欣赏它，但它就像 put "overflow: hidden;"在 .container 中，在 chrome 中看起来不太好。