Bootstrap 4, bg-inverse not showing?

Question

Trying to follow the navbar example in Bootstraps documentation, I have a problem where the background colour of the navbar doesn\'t get loaded.

Answer 1

Bootstrap have dropped support for bg-inverse.

Answer 2

I think you are using Bootstrap beta version. Use the Alpha version. It will solve the problem , they are not provide bootstrap 4 beta for the navbar-inverse bg-inverse

bootstrap -v 4.0.0.alpha6

<nav class="navbar navbar-inverse bg-inverse">
  <!-- Navbar content -->
</nav>

<nav class="navbar navbar-inverse bg-primary">
  <!-- Navbar content -->
</nav>

<nav class="navbar navbar-light" style="background-color: #e3f2fd;">
  <!-- Navbar content -->
</nav>

look at this https://getbootstrap.com/docs/4.0/components/navbar/

bootstrap@4.0.0-beta

<nav class="navbar navbar-dark bg-dark">
  <!-- Navbar content -->
</nav>

<nav class="navbar navbar-dark bg-primary">
  <!-- Navbar content -->
</nav>

<nav class="navbar navbar-light" style="background-color: #e3f2fd;">
  <!-- Navbar content -->
</nav>

look at this https://getbootstrap.com/docs/4.0/components/navbar/

Answer 3

Bootstrap 4 doesn't have css classes navbar-inverse bg-inverse. You need to use combination of navbar-light bg-light or navbar-dark bg-darkwith nav component. For example:

• <nav class="navbar navbar-dark bg-dark"> <a class="navbar-brand" href="#">Navbar</a> </nav>