"KL :: Blog Post Page"
Bootstrap 3.3.0 Snippet by Kaitani Labs

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 ---------->
<link href="http://fontawesome.io/assets/font-awesome/css/font-awesome.css" rel="stylesheet" media="screen">
<article>
<header>
<h1>Your Blog Post Title</h1>
</header>
<div class="background-bar">
</div>
<section class="container-fluid main-body">
<section class="row">
<div class="hidden-xs col-sm-1 col-md-2">
</div>
<div class="col-xs-12 col-sm-10 col-md-8">
<div class="content-holder">
<div class="content-description">
<div class="author-social author-social-left">
<img src="data:image/png;base64,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">
<img src="data:image/png;base64,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">
<img src="data:image/png;base64,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">
</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
header {
margin-top: 0;
background: url("http://lorempixel.com/1200/500/nature");
min-height: 500px;
background-size: cover;
display: table;
width: 100vw;
}
header h1 {
text-align: center;
color: #fff;
display: table-cell;
vertical-align: middle;
font-size: 3em;
text-shadow: 2px 3px rgba(0,0,0,0.75);
}
.background-bar {
background: #dedede;
height: 90px;
-webkit-box-shadow: inset 0px 4px 12px 0px rgba(50, 50, 50, 0.75);
-moz-box-shadow: inset 0px 4px 12px 0px rgba(50, 50, 50, 0.75);
box-shadow: inset 0px 4px 12px 0px rgba(50, 50, 50, 0.75);
}
.main-body {
background: #ffffff;
-webkit-box-shadow: 0px -4px 14px 0px rgba(50, 50, 50, 0.35);
-moz-box-shadow: 0px -4px 14px 0px rgba(50, 50, 50, 0.35);
box-shadow: 0px -4px 14px 0px rgba(50, 50, 50, 0.35);
}
.content-holder {
margin-top: -140px;
border-top-left-radius: 12px;
XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX
1
XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX

Related: See More


Questions / Comments: