title: How to make Bootstrap 4 navbar to use flexbox
body: <p>I'm trying to make Bootstrap 4 navbar to use flexbox. I was almost able to make it, but there is still some strange Javascript issue. Everything seems to work first but if I toggle open navbar once and then close it, Bootstrap javascript adds element style "height: 0px;" to navbar-toggleable-{} class. This makes element to be positioned improperly since I use "align-items: center" in parent element and when height is set to be zero, then elements top is thought to be the center. If I manually remove that style from element, it "fixes" the problem.</p>
  
  <p>Picture below is showing my problem:</p>
  
  <p><a href="https://i.stack.imgur.com/QiQAA.png" rel="nofollow"><img src="https://i.stack.imgur.com/QiQAA.png" alt="enter image description here"></a></p>
  
  <p>This is only case which is failing. If element is open when I resize window up, element is in it's normal position and there is no extra style added by Javascript. And if I don't open collapsed navbar ever, everything works.</p>
  
  <p>So my question is, how I could implement Bootstrap 4 navbar which is actually working and using flexbox? I guess easiest fix is to stop Bootstrap adding that extra style to element. It's not needed since if that element is not visible, then it has "display: none" anyway. And if it's visible, height shouldn't be certainly zero.</p>
  
  <p>Edit:
  I did some more research and found that if I add removeAttr('style') to right place in Bootstrap javascript, then it seems to fix the problem. However, I'm not sure if that is the right approach to fix that.</p>