html - 导航栏超出所有其他页面 div 宽度并在页面调整大小时创建空白区域

Question

我有this废话，当我在不同的设备上查看它时，当宽度低于 890 像素时，会出现水平滚动条。现在网站的任何部分都没有扩展到这个白色部分，所以它看起来很难看，但导航栏确实如此，所以我觉得问题出在导航栏样式上？

这是我所有的导航栏代码

<div class="container-fluid mynav">
  <ul class="uppercase mynavmenu">
    <li><a href="http://danceforovariancancer.com.au">Home</a></li>
    <li><a class="scroll" href="#about">about</a></li>
    <li><a class="scroll" href="#register">register</a></li>
    <li><a class="scroll" href="#acts">acts</a></li>
    <li><a class="scroll" href="#faq">faq</a></li>
    <li><a class="scroll" href="#contact">contact</a></li>
  </ul>

除了 Bootstrap 之外，这是它的所有样式。

    /** --------------------------------------------------------- NAVIGATION STYLING ----------------------------------------------------------------- **/


.mynav {
    padding-top: 25px;
    padding-bottom: 15px;
    background-color: #0094ab;
    position: fixed;
    right: 0;
    left: 0;
    z-index: 9999;
}

.mynavmenu li {
    display: inline;
}

.mynavmenu a {
    margin-left: 24px;
    margin-right: 27px;
    padding-left: 6px;
    padding-right: 3px;
    display: inline-block;
    color: #fff;
    letter-spacing: 3px;
    font-family: 'Raleway', sans-serif;
    font-weight: 200;
    text-align: center;
}

.mynavmenu a:hover, .mynavmenu a:focus, .mynavmenu a:active {
    display: inline-block;
    color: #e2faff;
    letter-spacing: 3px;
    text-decoration: none;
    background: rgba(255, 255, 255, 0.13);
}

.mynavmenu {
    text-align: center;
}

谢谢大家，我看不出有任何理由会延长。我还没有对网站进行媒体查询，所以可能是一个 col-offset 把它推过去了？但我对此表示怀疑，干杯。

Answer 1

这应该有所帮助(在较小屏幕的媒体查询中):

.dfocimg { width: 100%; }