Topic: bootstrap navbar toggle not showing in mobile
tonythepooh priority asked 2 years ago
<!-- Navbar -->
<nav class="navbar navbar-expand-lg navbar-dark d-none d-lg-block" style="z-index: 2000;">
<div class="container-fluid">
<!-- Navbar brand -->
<a class="navbar-brand nav-link" target="_blank" href="https://www.sushishirokuma.com/">
<strong>Shiro Kuma</strong>
</a>
<button class="navbar-toggler" type="button" data-mdb-toggle="collapse" data-mdb-target="#navbarExample01"
aria-controls="navbarExample01" aria-expanded="false" aria-label="Toggle navigation">
<i class="fas fa-bars"></i>
</button>
<div class="collapse navbar-collapse" id="navbarExample01">
<ul class="navbar-nav me-auto mb-2 mb-lg-0">
<li class="nav-item active">
<a class="nav-link" aria-current="page" href="https://sushishirokuma.com">Home</a>
</li>
<li class="nav-item">
<a class="nav-link" href="https://www.toasttab.com/shirokumasushi/v3" rel="nofollow"
target="_blank">Menu</a>
</li>
<li class="nav-item">
<a class="nav-link" href="https://www.doordash.com/store/shiro-kuma-sushi-san-rafael-456545/" rel="nofollow"
target="_blank">Doordash</a>
</li>
<li class="nav-item">
<a class="nav-link" href="https://www.grubhub.com/restaurant/shiro-kuma-sushi-1518-4th-st-san-rafael/2054205" rel="nofollow"
target="_blank">Grubhub</a>
</li>
</ul>
<ul class="navbar-nav d-flex flex-row">
<!-- Icons -->
<li class="nav-item me-3 me-lg-0">
<a class="nav-link" href="https://www.facebook.com/profile.php?id=100070537982658" rel="nofollow" target="_blank">
<i class="fab fa-facebook-f"></i>
</a>
</li>
<li class="nav-item me-3 me-lg-0">
<a class="nav-link" href="https://www.instagram.com/shiro_kuma_sushi" rel="nofollow" target="_blank">
<i class="fab fa-instagram"></i>
</a>
</li>
</ul>
</div>
</div>
</nav>
<!-- Navbar -->
Add comment
Kamila Pieńkowska staff answered 2 years ago
tonythepooh priority answered 2 years ago
addition on style
#intro { background-image: url("img/shirokuma5.JPG"); height: 50vh; }
/* Height for devices larger than 576px */
@media (min-width: 992px) {
#intro {
margin-top: -65px;
}
}
.navbar .nav-link {
color: #fff !important;
}
</style>
FREE CONSULTATION
Hire our experts to build a dedicated project. We'll analyze your business requirements, for free.
Status
Answered
Specification of the issue
- ForumUser: Priority
- Premium support: Yes
- Technology: MDB Standard
- MDB Version: MDB5 5.0.0
- Device: iPhone
- Browser: Chrome
- OS: MacOS
- Provided sample code: No
- Provided link: No