When I resize my page to width:750px;, my navigation bar is not collapsing the items. Despite trying to edit my CSS, I am still clueless. Here is my live page.
This is the CSS for my slidebar:
@media (max-width: 480px) { /* Slidebar width on extra small screens. */
.sb-slidebar {
width: 70%;
}
.sb-width-thin {
width: 55%;
}
.sb-width-wide {
width: 85%;
}
}
...
This is my style.css:
@media (min-width: 768px){
#logo {
text-align: left;
}
ul.navbar-nav {
display: block;
}
}
...
This is my HTML:
<div class="navbar navbar-default navbar-fixed-top sb-slide" role="navigation">
...
I am looking to hide my menu items when I resize the screen. Thank you!