CSS Blockquote Template Not everybody needs to use blockquotes inside their website. But I feel these are an excellent HTML element for separating quoted or repeated content within blogs or webpages. This basic chunk of CSS offers a default style for your blockquotes so they don’t appear as drab and bland.

CSS Blockquote Template

blockquote {
    background: #f9f9f9;
    border-left: 10px solid #ccc;
    margin: 1.5em 10px;
    padding: .5em 10px;
    quotes: "\201C""\201D""\2018""\2019";
}
blockquote:before {
    color: #ccc;
    content: open-quote;
    font-size: 4em;
    line-height: .1em;
    margin-right: .25em;
    vertical-align: -.4em;
}
blockquote p {
    display: inline;
}