Topic: Double Navigation with hidden SideNav & fixed Navbar Issue
brianacinc asked 6 years ago
Looking for a fixed top nav bar and a hidden side nav. This works well on a smaller resolution but on larger screens the "breadcrumb" hamburger is hidden. How do I get the hamburger icon and sidenav slide-out to stay and work on the larger screen?
We are doing this.... // SideNav Initialization $(".button-collapse").sideNav({ closeOnClick: true });
Marta Szymanska staff pro premium answered 6 years ago
Hi,
if this layout https://mdbootstrap.com/snippets/jquery/mdbootstrap/105292 isn't right for you, then, please, provide a demo in the snippet showing the problem here: https://mdbootstrap.com/snippets/. I need to know more details so that I can help you.
Best, Marta
siepmannj pro answered 6 years ago
Hi,
same problem here. Checked for 4.7.6
Digging the css:
.double-nav .button-collapse {
position: absolute;
left: 10px;
font-size: 1.5rem; }
@media (min-width: 1440px) {
.double-nav .button-collapse {
display: none; } } **<-- Button hidden in this media query**
@media (max-width: 1440px) {
.double-nav .button-collapse {
display: block;
position: relative;
font-size: 1.4rem;
margin-right: 10px;
margin-left: 10px; } }
Why is the button hidden? Is it bug or feature ? :-)
thanx in advance,
jan
Marta Szymanska staff pro premium answered 6 years ago
Hi,
this is a feature, for screens bigger than 1440px a side-nav appears and a button-collapse is visible only for smaller devices.
Best, Marta
FREE CONSULTATION
Hire our experts to build a dedicated project. We'll analyze your business requirements, for free.
Answered
- User: Free
- Premium support: No
- Technology: MDB jQuery
- MDB Version: 4.6.1
- Device: Laptop
- Browser: Chrome
- OS: Ubuntu
- Provided sample code: No
- Provided link: No