CODEWITHSUNDEEP
htmlcsstwitter-bootstrap
Web O
Web O

Reputation: 103

Dropdown menu doesn't work on bootstrap

I tried to do a small dropdown menu with bootstrap but without success. This is the code:

<ul class="nav navbar-nav">
                <li>
                    <a href="#">Text</a>
                </li>
                <li class="dropdown">
                    <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">Dropdown <span class="caret"></span></a>
                    <ul class="dropdown-menu">
                        <li><a href="logout.php">Logout</a></li>
                    </ul>
                </li>
</ul>

Any idea why it doesn't work? Thanks.

Upvotes: 1

Views: 5016

Answers (1)

ajthinking
ajthinking

Reputation: 4558

Make sure you load jQuery, bootstrap.js and bootstrap.css.

<script src="https://code.jquery.com/jquery-3.2.1.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet">

Fiddle: https://jsfiddle.net/0z36747j/

<script src="https://code.jquery.com/jquery-3.2.1.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet">

<ul class="nav navbar-nav">
  <li>
    <a href="#">Text</a>
  </li>
  <li class="dropdown">
    <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">Dropdown <span class="caret"></span></a>
    <ul class="dropdown-menu">
      <li><a href="logout.php">Logout</a></li>
    </ul>
  </li>
</ul>

Upvotes: 3

Related Questions