Scott Bainbridge
Scott Bainbridge

Reputation: 21

Bootstrap dropdown won't work

I've been messing around with my website for a while now and can't seem to get the dropdown on my navigation to actually drop down. I've read a few questions regarding this and couldn't find something that was this specific.

I have my .js file installed and everything is linked up (as far as I know)

<script src="/js/bootstrap.js" type="text/javascript"></script>
<script src="/js/bootstrap.min.js" type="text/javascript"></script>

<body>

<div class="navbar navbar-inverse navbar-fixed-top">
  <div class="navbar-inner">
    <div class="container">
      <a class="btn btn-navbar" data-toggle="collapse" data-target=".nav-collapse">
        <span class="icon-bar"></span>
        <span class="icon-bar"></span>
        <span class="icon-bar"></span>
      </a>
      <a class="brand" href="bootstrapindex.html">Student Food</a>
      <div class="nav-collapse collapse">
        <ul class="nav">
          <li class="active"><a href="bootstrapindex.html">Home</a></li>
          **<li><a href="about.html">About</a></li>
            <li class="dropdown">
                <a href="#" class="dropdown-toggle" data-toggle="dropdown">Recipes<b class="caret"></b></a>
            <ul class="dropdown-menu">
              <li><a href="#">Featured</a></li>
              <li><a href="about.html">Latest</a></li>
              <li><a href="about.html">Something else here</a></li>**
            </ul>
          </li>
            </ul>

Can't seem to see why this won't work. If anyone could help that would be amazing.

Upvotes: 2

Views: 4403

Answers (2)

Sara
Sara

Reputation: 8242

You're including the Bootstrap JavaScript twice.
Remove one of the following lines:

<script src="/js/bootstrap.js" type="text/javascript"></script>
<script src="/js/bootstrap.min.js" type="text/javascript"></script>

bootstrap.min.js is just a minified version of bootstrap.js; it's the same code.

Upvotes: 2

Nikolay Shebanov
Nikolay Shebanov

Reputation: 1443

Try to remove wrapping div <div class="nav-collapse collapse">. I think, dropdown could be hidden by overflow (it was hidden, when I copy-pasted your code snippet).

Upvotes: 0

Related Questions