"blockquote"
Bootstrap 4.1.1 Snippet by tieusuquay79

Post to Facebook Tweet this

1
2
3
4
5
6
7
8
9
10
11
12
13
14
<link href="//maxcdn.bootstrapcdn.com/bootstrap/4.1.1/css/bootstrap.min.css" rel="stylesheet" id="bootstrap-css">
<script src="//maxcdn.bootstrapcdn.com/bootstrap/4.1.1/js/bootstrap.min.js"></script>
<script src="//code.jquery.com/jquery-1.11.1.min.js"></script>
<!------ Include the above in your HEAD tag ---------->
<blockquote cite="aa">
Don't compare yourself with others. There's no
Comparison between The Sun & The Moon. They shine
when it's their Time. visit for Demo Link
</blockquote>
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
blockquote {
margin: 1.5em 10px;
font-style: italic;
text-transform: capitalize;
color: #888;
border: 1px solid #27ae60;
border-radius: 3px;
background: rgba(1, 255, 36, 0.058823529411764705);
border-left: 4px solid #e06666;
padding: 10px;
}
blockquote:before {
position: absolute;
top: 0em;
left: 50%;
transform: translate(-50%, -50%);
background: #fff;
width: 3rem;
height: 2rem;
font: 6em/1.08em 'PT Sans', sans-serif;
color: #666;
text-align: center;
}
blockquote:after {
content: "\2013 \2003" attr(cite);
display: block;
text-align: right;
font-size: 0.675em;
color: #e74c3c;
text-align: center;
}
XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX
1
XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX

Related: See More

Now UI Dashboard
A Better Blockquote
Blockquote Box

Questions / Comments: