"Group Buttons"
Bootstrap 3.3.0 Snippet by MTaqi

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
<link href="//maxcdn.bootstrapcdn.com/bootstrap/3.3.0/css/bootstrap.min.css" rel="stylesheet" id="bootstrap-css">
<script src="//maxcdn.bootstrapcdn.com/bootstrap/3.3.0/js/bootstrap.min.js"></script>
<script src="//code.jquery.com/jquery-1.11.1.min.js"></script>
<!------ Include the above in your HEAD tag ---------->
<div class="container">
<div class="row">
<div class="btn-group pull-right mt10" role="group" aria-label="...">
<a href="/ajax/subscribe.php?keyword=chillizone, pakistan" rel="nofollow" class="btn btn-default subscribe cboxElement" title="Subscribe to email">Subscribe</a>
<button type="button" class="btn btn-default toggle-visibility" id="btnfilter" data-target="#filterbox" title="Search Filter">Filter</button>
<div class="btn-group" role="group">
<button type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown" aria-expanded="false" title="Sorting">Date (newest) <span class="caret"></span></button>
<ul class="dropdown-menu filter pull-right" id="sorting" role="menu"><li><a href="#" data-value="relevansi">Relevance</a></li><li class="active" data-selected-item="true"><a href="#" data-value="tanggal-desc">Date (newest)</a></li><li><a href="#" data-value="tanggal-asc">Date (oldest)</a></li><li><a href="#" data-value="harga-asc">Salary (lowest)</a></li><li><a href="#" data-value="harga-desc">Salary (highest)</a></li></ul>
</div>
</div>
</div>
</div>
XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX
1
2
3
4
5
6
7
8
9
10
11
12
.btn-default {
text-shadow: 0 1px 0 #fff; */
background-image: -webkit-linear-gradient(top,#fff 0,#e0e0e0 100%); */
background-image: -o-linear-gradient(top,#fff 0,#e0e0e0 100%);
background-image: -webkit-gradient(linear,left top,left bottom,from(#fff),to(#e0e0e0)); */
background-image: linear-gradient(to bottom,#fff 0,#e0e0e0 100%); */
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffffff', endColorstr='#ffe0e0e0', GradientType=0);
filter: progid:DXImageTransform.Microsoft.gradient(enabled=false);
background-repeat: repeat-x; */
border-color: #dbdbdb; */
border-color: #ccc; */
}
XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX
1
XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX

Related: See More


Questions / Comments: