Uses

Use block quotes to make a quote stand out from the rest of the content on the page.

Styles

The left side of the div container has 2px solid #a51417 border. There is 30px padding between the border and text. The text is larger but lighter weight than the main body text.

Examples

In the above example, the block quote shows up in between paragraphs. Its style is visually distinctive with a red left border, a larger font size, and an indentation in the content.

Code

HTML
<blockquote> <p>&#8220;Answers can’t be found in a single day, overnight, when the problem happens.&#8221;</p> </blockquote>
CSS
article blockquote { margin: 35px 0 35px 40px; padding-left: 25px; border-left: 2px solid #900; font-weight: 300; font-size: 22px; line-height: 32px; } article blockquote p { font-size: 22px; line-height: 32px; margin-bottom: 25px; }