问修正引导菜单
EN

Stack Overflow用户

提问于 2017-01-05 20:02:41

回答 1查看 43关注 0票数 0

我在某些屏幕上出现了一些引导菜单的问题，在这些屏幕上，它不是像您可以看到的这里那样在其他屏幕中居中的。

我已经删除了导航条右，但它没有工作。我没有任何特别的css改动。只是字体大小和颜色。

<nav class="navbar">
<div class="container-fluid social-nav">
    <a href="https://www.facebook.com/"><img alt="Facebook" src="images/soc-icon4.png"></a>
    <a href="https://www.instagram.com/"><img alt="Instagram" src="images/soc-icon3.png"></a>
</div>

<div class="container-fluid menu-nav">
    <div class="navbar-header logo">
      <a href="index.html"><img alt="Dra Camila" src="images/logo.png"></a>
    </div>
    <ul class="nav navbar-nav navbar-right">
      <li class="myactive"><a href="index.html">Home</a></li><hr>
      <li><a href="sobre.html">About</a></li><hr>
      <li><a href="serviços.html">Services</a></li><hr>
      <li><a href="tratamentos.html">Treatments</a></li><hr>
      <li><a href="contato.html">Contact</a></li>
    </ul>
</div>
</nav>

有什么建议来解决吗？

html

css

twitter-bootstrap

Stack Overflow用户

回答已采纳

发布于 2017-01-05 20:22:59

去掉menu-nav中的填充物，您就都准备好了：

.menu-nav {
    background-color: rgba(0, 0, 0, 0.7);
    /* padding: 10px 150px 10px 150px; */
}

对于iPad视图中的其他问题，请为浮动项和更改菜单分配宽度：

@media (min-width: 768px)
.navbar-nav>li {
    float: left;
    width: 400px;
}

@media (min-width: 768px)
.navbar-right {
    /* float: right!important; */
    /* margin-right: -15px; */
}

票数 0

查看全部 1 条回答

页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持

原文链接：

https://stackoverflow.com/questions/41493699

复制

相似问题

问修正引导菜单
EN

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问修正引导菜单EN

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问修正引导菜单
EN