BOOTSTRAP NAV Collapsed collapse changing height alignment

Question

BOOTSTRAP NAV Collapsed collapse changing height alignment

Problem: I need a navbar with higher HEIGHT.

Changed the css

.navbar {
  min-height: 80px;
  vertical-align: middle;
}

.navbar-collapse .collapse .in {
    padding-top:80px;
}

the vertical alignment of the links is not vertically centered
when collapsed, the menu is invading the logo space

0

bootstrap align nav-bar

Author: Davi R Rossini, 2017-09-08

Source

1 answers

score 1 · Accepted Answer

In your HTML put your navbar inside a class called .header for example. Within this class work the size of it in your certain media queries. Your VC TB logo can place it with the img-responsive class and work its size on each media queries tb.

Ex: normal (desktop) .header { height: 200px } Cellular average: .header {height: 100px}