i've created bootstrap navbar changed color, background-color , hover color. problem eversince made these changes, navbar won't stay fixed. new css , searched everywhere solution, sadly everywhere says swap navbar-static navbar-fixed, have navbar-fixed in code. please help!
here relevant css , html:
.navbar-custom { z-index:999999; /* here fixed issue collapsed navbar showed underneath slider under it*/ position: absolute; background-color: #e46142; } .section1 .navbar-custom .container #navbar-collapse .nav.navbar-nav li a{ color: white; /* here had target text otherwise color not change */ } .section1 .navbar-custom .container .navbar-header .navbar-brand{ color: white; } .section1 .navbar.navbar-custom.navbar-fixed-top .container .navbar-header .navbar-toggle .icon-bar{ background-color: white; } ul.nav a:hover { color: #000 !important; }
<div class="section1"> <nav class="navbar navbar-custom navbar-fixed-top" role="navigation"> <div class="container"> <div class="navbar-header"> <button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#navbar-collapse"> <span class="icon-bar"></span> <span class="icon-bar"></span> <span class="icon-bar"></span> </button> <a href="#" class="navbar-brand">name</a> </div><!-- end nav bar header --> <div class="collapse navbar-collapse" id="navbar-collapse"> <ul class="nav navbar-nav"> <li><a href="#">text1</a></li> <li><a href="#">text2</a></li> <li><a href="#">text3</a></li> <li><a href="#">text4</a></li> <li><a href="#">text5</a></li> </ul> </div> </div><!-- end container --> </nav> <!-- end nav bar --> </div>
change position
or remove position
.navbar-custom { z-index:999999; /* here fixed issue collapsed navbar showed underneath slider under it*/ position: fixed; background-color: #e46142; }
Comments
Post a Comment