【问题标题】:Responsive navigation has scroll bar?响应式导航有滚动条?
【发布时间】:2015-08-24 04:32:44
【问题描述】:

我一直在搞乱 Wordpress 的引导主题,当我缩小导航时,它变成了滚动条。这很奇怪,因为它应该是重叠的。

网址是:http://sendtohim3dprinting.co.uk/

这就是它的外观:

我想不通。

这些是我所做的 CSS 更改:

.navbar {
    height: 110px;
    background: #2476bf;
}
.collapse.navbar-collapse {
    max-width: 850px;
    height: 110px ;
}
.menu-item a {
    height: 110px;
    width: 200px;
}
li.menu-item.menu-item-object-page a, .menu-item-type-custom, .menu-item-type-custom.menu-item-object-custom.menu-item-2413 a {
    text-align: center;
    line-height: 90px;
    font-family: 'Pacifico', cursive ;
    font-size: 1.5em;

}
.collapse.navbar-collapse {
    float: right;
}

导航栏的原始CSS非常长,但可以找到here

关于滚动条,我以前没有遇到过这种问题。

任何帮助将不胜感激。

【问题讨论】:

  • height: 110px 更改为 height: auto 或将其删除。
  • 已将其更改为自动,但现在当我按下导航时,它会将页面向下推,而不是放在顶部

标签: html css wordpress


【解决方案1】:

只需将overflow: hidden 添加到您的.nav > li 类。喜欢这个:

nav > li {
    position: relative;
    display: block;
    overflow: hidden;
}

【讨论】:

    【解决方案2】:

    如果您的目标是像上图那样隐藏水平滚动条,您可以尝试:

    <style type="text/css">
    body {
    overflow-x:hidden;
    }
    </style>
    

    【讨论】:

      猜你喜欢
      • 1970-01-01
      • 1970-01-01
      • 2012-12-01
      • 2015-08-30
      • 1970-01-01
      • 1970-01-01
      • 2015-03-16
      • 1970-01-01
      • 2021-04-18
      相关资源
      最近更新 更多