当隐藏溢出时,引导程序导航栏溢出并断开链接
问题描述:
我有一个在移动设备上溢出的引导程序导航栏,当我将CSS设置为隐藏溢出时,按钮链接断开。我处于全面亏损状态。这是我的导航栏代码。这里是site.的链接,如果有人有机会帮助谢谢,我会爱上它。当隐藏溢出时,引导程序导航栏溢出并断开链接
HTML
CSS
.navbar {
height: 125px;
background-color:#0d0d0d !important;
}
.navbar-brand {
position: relative!important;
left: 45px!important;
bottom: 10px!important;
font-size: 4em!important;
color: white!important;
font-family: "Montserrat", sans-serif !important;
white-space:nowrap;
}
.nav.navbar-nav.navbar-left li a {
color: white;
position: relative;
right: 475px;
top: 66px;
font-family: "Montserrat", sans-serif !important;
}
.nav.navbar-nav.navbar-left li a:hover {
color: orange;
}
#myNavbar {
background-color: #0d0d0d ;
}
@media screen and (max-width: 990px) {
.navbar-header {
float: none !important;
}
.navbar-brand {
left: 0 !important;
}
.nav li a {
padding: 5px;
margin-right: 50px;
}
.nav.navbar-nav.navbar-left li a {
color: white;
right: 0px;
top: 0px;
}
}
@media screen and (max-width: 767px) {
.navbar-brand {
font-size: 40px !important;
position: relative !important;
top: -20px !important;
left: -10px !important;
}
.navbar {
height: 70px;
}
.nav.navbar-nav.navbar-left li a {
color: #0d0d0d;
right: 0;
top: 0;
}
.navbar-collapse{
overflow-x:hidden;
}
.collapsing,
.in {
background-color: #222222;
position: relative;
top: -30px;
}
.collapsing ul li a,
.in ul li a {
color: white!important;
}
.collapsing ul li a:hover,
.in ul li a:hover {
color: orange!important;
}
}
答
您需要调整您的完美无瑕的响应显示视窗meta标签。
你目前有:
<meta name="viewport" content="width=device-width, initial-scale=1">
添加最小,最大规模,用户可扩展性的元标记即可解决你的问题。
试试这个:
<meta name="viewport" content="initial-scale=1.0,minimum-scale=1.0,maximum-scale=1.0,user-scalable=0,width=device-width" />
+0
祝你好运!这很有效,非常感谢你! – kgoode517
什么是 “导航条上移动溢出” 是什么意思?你的页面似乎是正确的。 – aitor