"Business Card"
Bootstrap 3.3.0 Snippet by bersling

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
<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="col-sm-6">
<div class="business-card">
<div class="media">
<div class="media-left">
<img class="media-object img-circle profile-img" src="http://s3.amazonaws.com/37assets/svn/765-default-avatar.png">
</div>
<div class="media-body">
<h2 class="media-heading">Daniel</h2>
<div class="job">CEO</div>
<div class="mail"><a href="mailto:daniel@bla.ch">daniel@bla.ch</a> </div>
</div>
</div>
</div>
</div>
<div class="col-sm-6">
<div class="business-card">
<div class="media">
<div class="media-left">
<img class="media-object img-circle profile-img" src="http://s3.amazonaws.com/37assets/svn/765-default-avatar.png">
</div>
<div class="media-body">
<h2 class="media-heading">Samuel</h2>
<div class="job">Business Development</div>
<div class="mail"><a href="mailto:samuel@bla.ch">samuel@bla.ch</a> </div>
</div>
</div>
</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
/*Don't copy this part*/
body{
margin-top: 20px;
}
/*Business Card Css */
.business-card {
border: 1px solid #cccccc;
background: #f8f8f8;
padding: 10px;
border-radius: 4px;
margin-bottom: 10px;
}
.profile-img {
height: 120px;
background: white;
}
.job {
color: #666666;
font-size: 17px;
}
.mail {
font-size: 16px;
}
XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX
1
XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX

Related: See More


Questions / Comments: