"Store Icons"
Bootstrap 3.0.3 Snippet by shawnm5

Post to Facebook Tweet this

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
<link href="//netdna.bootstrapcdn.com/bootstrap/3.0.3/css/bootstrap.min.css" rel="stylesheet" id="bootstrap-css">
<script src="//netdna.bootstrapcdn.com/bootstrap/3.0.3/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="col-md-6"><h2>Store Icons</h2></div>
</div>
<div class="row">
<div class="col-md-6">
<!-- apple store button -->
<a class="btn btn-lg btn-primary big-btn" href="#">
<i class="glyphicon glyphicon-phone pull-left"></i><div class="btn-text"><small>Available on the</small><br><strong>App Store</strong></div></a>
<!-- android button -->
<a class="btn btn-lg btn-success big-btn android-btn" href="#">
<img width="80px" class="pull-left" src="http://www.userlogos.org/files/logos/jumpordie/google_play_04.png"><div class="btn-text"><small>Available on</small><br><strong>Google Play</strong></div></a>
</div>
</div>
</div>
XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
.big-btn{
padding: 9px 0px 9px 0px;
width: 215px;
}
.big-btn i{
font-size: 65px;
margin-right: 0px !important;
}
.big-btn strong{
font-size: 25px;
text-shadow: 1px 2px 0px #34659B;
color: #fff;
line-height: 24px;
}
.big-btn .btn-text{
margin-top:6px;
}
.big-btn small{font-size: 75%;}
.android-btn{
width: 240px;
padding: 13px 17px 13px 0px;
background-color: #000;
border-color: #000;
}
.android-btn:hover{
background-color: #272727;
}
.android-btn i{
font-size: 55px;
}
XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX
1
XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX

Related: See More

Rotating CSS Card
Spinning social icons
Attractive Round Cornered Button with Icons

Questions / Comments: