Left and right double quotation marks with :before and :after pseudoclass content

Submitted by Benjamin Melançon on September 12, 2010 - 3:57pm

Style blockquote with no indent, different color, and :before and :after open-quote and close-quote.

#block-views-featuredsupporter-block_1 blockquote { margin: 1em 0; color: #0e4e60; font-weight: bold; font-style: italic; }

#block-views-featuredsupporter-block_1 blockquote p:before {
content: open-quote;
}

#block-views-featuredsupporter-block_1 blockquote p:after {
content: close-quote;
}

CSS rocks.

Searched words:

double quote “ ” style blockquotes

Comments

Your name: *

E-mail: *

The content of this field is kept private and will not be shown publicly.

Homepage:

Subject:

Comment: *

You may post code using <code>...</code> (generic) or <?php ... ?> (highlighted PHP) tags.
You can use Markdown syntax to format and style the text. Also see Markdown Extra for tables, footnotes, and more.
Web page addresses and e-mail addresses turn into links automatically.
Allowed HTML tags: <a> <em> <strong> <cite> <code> <ul> <ol> <li> <dl> <dt> <dd> <img> <blockquote> <small> <h2> <h3> <h4> <h5> <h6> <sub> <sup> <p> <br> <strike> <table> <tr> <td> <thead> <th> <tbody> <tt> <output>
Lines and paragraphs break automatically.