Vertically center bootstrap dropdown menu icon in collapse mode

1
votes

enter image description here

I've changed bootstrap navbar height and all other components in my navbar to center vertically to the new nav-bar height. I'm having trouble finding the css for the menu icon when the urls collapsed in the mobile mode.

Do you know how I can change the padding, margin for this menu icon on Bootstrap 3 navbar?

Thanks

1
twitter-bootstrapmenutwitter-bootstrap-3navbarcollapse

1 Answers

2
votes

I used this CSS when I changed my navbar height from the default 50px to 70px.

Looking at your screenshot, it looks like you just need to change the margin on the .navbar-toggle class from the default 8px to appropriate values for your new navbar height.

Demo: http://www.bootply.com/8gnPRqrILj

.navbar {
    min-height: 70px;
}

.navbar-brand {
    height: 70px;
    line-height: 40px;
}

.navbar-nav > li > a {
    line-height: 40px;
}

.navbar-toggle {
    margin-top: 18px;
    margin-bottom: 18px;
}