I am practicing using Twitter Bootstrap. I’ve repeatedly tried to implement a dropdown menu, but I can’t seem to make it work. Can anyone please help me identify why the HTML shown below is not resulting in a working Bootstrap dropdown menu?
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Home</title>
<link rel="stylesheet" type="text/css" href="css/bootstrap.min.css">
</head>
<body>
<div class="container" style="padding: 20px;">
<div class="row">
<div class="col-lg-12" style="height: 50px; padding: 0px; margin: 0px;">
<ul class="nav nav-tabs">
<li class="active"><a href="#">Home</a></li>
<li class="dropdown">
<a class="dropdown-toggle" data-toggle="dropdown" href="#">
Academic
<span class="caret"></span>
</a>
<ul class="dropdown-menu">
<li><a href="#">academic 1</a></li>
<li><a href="#">academic 1</a></li>
<li><a href="#">academic 1</a></li>
</ul>
</li>
<li><a href="">Result</a></li>
<li><a href="">Notice Board</a></li>
</ul>
</div>
</div>
<div class="row">
<div class="col-lg-2" style="height: 800px; border: 1px solid;">
</div>
<div class="col-lg-7" style="height: 800px; border: 1px solid;"></div>
<div class="col-lg-3" style="height: 800px; border: 1px solid;"></div>
</div>
<div class="row">
<div class="col-lg-12" style="height: 150px; border: 1px solid;">
</div>
</div>
</div>
<script src="js/bootstrap.min.js"></script>
</body>
</html>
2
Answers
You are missing jquery CDN
That may be the problem, unless it works fine.
You should mention instead of
Use the following. Hope it will work now.