1blockquote {
2 font-family: Georgia, serif;
3 font-size: 18px;
4 font-style: italic;
5 width: 500px;
6 margin: 0.25em 0;
7 padding: 0.35em 40px;
8 line-height: 1.45;
9 position: relative;
10 color: #383838;
11}
12
13blockquote:before {
14 display: block;
15 padding-left: 10px;
16 content: "\201C";
17 font-size: 80px;
18 position: absolute;
19 left: -20px;
20 top: -20px;
21 color: #7a7a7a;
22}
23
24blockquote cite {
25 color: #999999;
26 font-size: 14px;
27 display: block;
28 margin-top: 5px;
29}
30
31blockquote cite:before {
32 content: "\2014 \2009";
33}
34
1blockquote {
2 font-family: Georgia, serif;
3 position: relative;
4 margin: 0.5em;
5 padding: 0.5em 2em 0.5em 3em;
6}
7/* Thanks: http://callmenick.com/post/styling-blockquotes-with-css-pseudo-classes */
8blockquote:before {
9 font-family: Georgia, serif;
10 position: absolute;
11 font-size: 6em;
12 line-height: 1;
13 top: 0;
14 left: 0;
15 content: "\201C";
16}
17blockquote:after {
18 font-family: Georgia, serif;
19 position: absolute;
20 /* display: block; don't use this, it raised the quote too high from the bottom - defeated line-height? */
21 float:right;
22 font-size:6em;
23 line-height: 1;
24 right:0;
25 bottom:-0.5em;
26 content: "\201D";
27}
28blockquote footer {
29 padding: 0 2em 0 0;
30 text-align:right;
31}
32blockquote cite:before {
33 content: "\2013";
34}