CODEWITHSUNDEEP
csstwitter-bootstrap-3
MayaGans
MayaGans

Reputation: 1845

bootstrap dropdown links not styling

I just copied code from the Bootstrap website: https://getbootstrap.com/docs/4.4/components/button-group/#nesting

But my dropdown menu links don't span the menu like these do - am I missing something?

I tried applying this code but to no avail Bootstrap Dropdown Not Styling Properly

lin

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.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"/>

  <div class="btn-group" role="group">
    <button id="btnGroupDrop1" type="button" class="btn btn-grey dropdown-toggle" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
      OTHER <span class='caret'></span>
    </button>
    <div class="dropdown-menu" aria-labelledby="btnGroupDrop1">
      <a class="dropdown-item" href="#">Dropdown link</a>
      <a class="dropdown-item" href="#">Dropdown link</a>
  </div>
</div>

Upvotes: 0

Views: 164

Answers (1)

Bhavesh Ajani
Bhavesh Ajani

Reputation: 1261

use these code to solve your problems 

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<meta http-equiv="X-UA-Compatible" content="IE=edge">
		<title>demo</title>
		<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.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"/>
	</head>
	<body>
		<div class="dropdown">
			<button class="btn btn-primary dropdown-toggle" type="button" data-toggle="dropdown">Dropdown Links
			<span class="caret"></span></button>
			<ul class="dropdown-menu">
				<li><a href="#">Link1</a></li>
				<li><a href="#">Link2</a></li>
				<li><a href="#">Link3</a></li>
			</ul>
		</div>
	</body>
</html>

I hope your problems will be solved, Thank You.

Upvotes: 1

Related Questions