Following the example of TB, I have a navbar that is marked up as follows:
<div class="container"> <div class="navbar"> <div class="navbar-inner"> <!-- nav bar items here --> </div> </div> </div>
I'd like this to span the full width of the screen and not have any rounded corners -- similar to static top styling of the navbar.
I can't seem to find how to do this in TB. If there isn't a way, what CSS would I need to override TB and not break responsiveness?
Approach 1: In Bootstrap 4, full width dropdown in Navbar might be possible by adding CSS properties either internally or externally based on conveniences. Focus on class dropdown and dropdown-menu only. Now, make top margin of dropdown-menu as zero pixel and add width to 100%.
So if you want full-width you either have to wrap your navbar in a row (inside your container) or you just don't use container 's at all. Show activity on this post.
Navbar togglers are left-aligned by default, but should they follow a sibling element like a .navbar-brand , they'll automatically be aligned to the far right. Reversing your markup will reverse the placement of the toggler. Below are examples of different toggle styles.
Just change the class container to container-fullwidth like this :
<div class="container-fullwidth">
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With