Bene
Bene

Reputation: 1281

CSS Bootstrap Background color of navbar not visible on collapsed nav

I set the height of the navbar to 80px. But when I shrink my window, the background of the nav links isn't visible. I think I forgot to set a margin any where, but I can't imagine where. Can someone help?

navbar.navbar-custom {
  background-color: #b80000;
  border-radius: 0;
  border: 0;
  height: 80px;
  margin-bottom: 0;
  z-index: 1001;
}
.navbar-custom .nav li a {
  padding: 15px 10px;
}
.navbar-custom .nav li a:hover {
  background-color: #b80000;
}
.navbar-custom .navbar-header .navbar-brand {
  padding: 5px 15px;
}
.navbar-custom .navbar-header .navbar-brand img {
  height: 70px;
  width: auto;
}
.navbar-custom .navbar-header .navbar-toggle {
  border: 1px solid #fff;
  margin-top: 25px;
}
.navbar-custom .navbar-header .navbar-toggle .icon-bar {
  border: 1px solid #fff;
}

Here is my link to Bootply

Upvotes: 3

Views: 335

Answers (1)

user4563161
user4563161

Reputation:

Remove /* height: 80px; */ from .navbar.navbar-custom

Possibly replace it with min-height:80px;

Upvotes: 2

Related Questions