"simple card"
Bootstrap 3.3.0 Snippet by eduluzcp

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
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
<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 ---------->
<link rel="stylesheet" media="screen" title="flags" type="text/css" href="https://cdnjs.cloudflare.com/ajax/libs/flag-icon-css/2.8.0/css/flag-icon.css" />
<div class="container">
<div class="row">
<div class="col-md-4 deck-box">
<h1>name</h1>
<div class="deck-brief">
saas sas sasa saas sasa
</div>
<div class="deck-tags">
<span class="label label-default">Default Label</span>
<span class="label label-primary">Primary Label</span>
<span class="label label-success">Success Label</span>
<span class="label label-info">Info Label</span>
</div>
<div class="deck-location">
<span class="flag-icon flag-icon-ca"></span>Canada
</div>
</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
.deck-box {
border: solid 1px #ccc;
padding: 10px;
}
.deck-box H1 {
border-left: solid 12px #ccc ;
margin: 0 auto;
padding: 0 0 0 10px;
font-size: x-large;
font-weight: bold;
color: navy;
}
.deck-brief {
font-size: small;
}
.deck-location {
margin-top: 10px;
}
.deck-location SPAN {
margin-right: 10px;
}
XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX
1
XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX

Related: See More

Argon Design System
bootstrap 4 card
Card Styles
Bootstrap Social Card

Questions / Comments: