Doe Doe - 4 months ago 8
HTML Question

Cant change the button color in bootstrap

I have cretaed this button in Bootstrap.



<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="col-sm-3">
<div class="dropdown2">
<button class="btn btn-default dropdown-toggle glyphicon glyphicon-shopping-cart" type="button" data-toggle="dropdown">Carello (99)
<span class="caret"></span>
</button>
<ul class="dropdown-menu" role="menu" aria-labelledby="menu1">
<li class="dropdown-header">Dropdown header 1</li>

</ul>
</div>

</div>





I have used some Bootstrap classes for buttons but when I try to change the color of this button in css nothing seems to happen.. How is it possible to change the color of this button in Bootstrap?
Here is my css :



.dropdown-menu{
background: #ff6600;
}





Thanks!

Answer

You are currently using .btn-default. Now you could make use of any of the other default Bootstrap button colors: .btn-primary, .btn-info, .btn-success, .btn-warning, .btn-danger.

Alternatively, you can modify the color of this button to a color of your choosing by writing a style for:

.dropdown2 .btn-default { 
  background: YOURCOLORHERE;
  color: YOURCOLORHERE;
}