Bootstrap nav menu is not collapsing

Question

I have a WordPress site that I'm trying to integrate Bootstrap into. The nav menu though, is not collapsed when I minimize the browser window. Only the background is collapsing. Here's the link: http://430designs.com/snp/

I'm not sure what I'm doing wrong. I do have a customizable version of Bootstrap CSS in and I'm pulling in the bootstrap JS.

Thanks in advance!

Answer 1

Looks like .collapse{display:none;} is missing from bootstraps css, and then the

@media (min-width: 768px){
    .navbar-collapse.collapse {
        display: block!important;
        height: auto!important;
        padding-bottom: 0;
        overflow: visible!important;
        visibility: visible!important;
    }
}

is missing as well...

If you're using a customized bootstrap, include the core, un-customized version first, to be sure that all relevant CSS is being added to your site.

from your comment, this is also missing:

.navbar-collapse.in {
    overflow-y: auto;
}
.collapse.in {
    display: block;
    visibility: visible;
}

But again, include the core unedited bootstrap first. :) I added this to the site via dev tools and it fixed it:

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.1/css/bootstrap.min.css">