我有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 把它推过去了?但我对此表示怀疑,干杯。
最佳答案
这应该有所帮助(在较小屏幕的媒体查询中):
.dfocimg { width: 100%; }
关于html - 导航栏超出所有其他页面 div 宽度并在页面调整大小时创建空白区域,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/34503736/