1. MDB Home Page
  2. Support Main Page
  3. General Bootstrap questions
Topic: MDB 4.4.1 Navbar Collapse toggle not showing correctly in old browser

benlo335 free asked 7 years ago

Current MDB version: 4.4.1

Some old browser such as android 4.4.4 native browser, iphone 5 ios 6, ipad air ios 8.3 can't show navbar collapse toggle to right correctly. Even in your template https://mdbootstrap.com/live/_MDB/index/docs/page-layouts/intro-fixed-transparent.html

Here is how it looks like in old browser: As you can see it goes to left

 

Can you explain why it is not showing correctly? Because the browser doesn't support specific css feature? Any alternative way to let toggle move to right? It is the problem of bootstrap or MDB?

benlo335 free answered 7 years ago

I got the solution, just add button.navbar-toggler{ float: right; } and the toggle will move to right correctly

Marta Wierzbicka staff commented 7 years ago

Ok, great.

Inganji TV free answered 5 years ago

I have the same problem , toggle is not working

Marta Wierzbicka staff commented 5 years ago

Hi,

if you have a problem with this in jQuery package (not in Angular), please create a snippet showing the problem here: https://mdbootstrap.com/snippets/ or paste here a link to your website to allow me to check the issue and try to fix this.

Best, Marta

Marta Wierzbicka staff answered 6 years ago

Hi, if the problem is in the Angular version of MDB, please ask your question in the correct category on our forum - MDB Angular. Best, Marta

alvics free answered 6 years ago

Hi there, Can anyone please explain why the (button.navbar-toggler) is not displaying when in mobile mode? The only thing I've changed in your navbar code is I deleted the color " navbar-dark black" form <mdb-navbar SideClass="navbar navbar-expand-lg navbar-dark black" [containerInside]="true"> So when in mobile mode no display but the element is there and the function of the button works but just you can't see it? I've tied changing the color with css !important but it does nothing? and when I change the element back to "navbar-dark black" it displays fine in mobile mode? I'm wanting a white navbar I'm using Angular 6 in my project, is there something I'm missing? Should be able to change the the color of an icon??? easily??. thanks Al
button.navbar-toggler{
color: #232323 !important;
}

Marta Wierzbicka staff answered 7 years ago

Hi, Unfortunately, I can't check this on my iPhone, iPad devices, because I've got the newest iOS but for checking if it is Bootstrap issue you can see how behaves a navbar in their documentation on your device with an old browser: https://getbootstrap.com/docs/4.0/components/navbar/#toggler. Best, Marta
Write
Create snippet
Please insert min. 20 characters.

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: Free
  • Premium support: No
  • Technology: General Bootstrap questions
  • MDB Version: -
  • Device: -
  • Browser: -
  • OS: -
  • Provided sample code: No
  • Provided link: No
Tags
About author
benlo335
19Support score
1Questions 1Answers 0Snippets