Bootstrap 3 navbar-toggle opening at 90% width then sliding right to fill screen?

Question

I have a navbar-toggle menu that, when opened, opens at what looks like 90% width then slides right to fill the screen! I cannot work out what the issue is here: http://www.bootply.com/ZanQBWTECu

Also in desktop view in the same example I have a nav-pills nav-justified menu that, when you hover over a button, increases in height to give the impression of a button moving down however when I click on one of the submenu options it jumps back to its original height.

How do I get the button to remain at the increased width?

Answer 1

remove

.nav {
letter-spacing: 1px;
position: absolute;
top: 0;
left: 0;
z-index: 20;
}

replace with

#rickwoodcollapse {
width:100%;
padding:0;
}

here is a bootply -