I have used this css to create custom quote marks at the start and end of a quote:
/* blockquote */
blockquote {
border-left: 3px solid #ccc;
margin: 1.5em 10px;
padding: 0.5em 30px 0.5em 20px;
font-style: italic!important;
quotes: "\201C""\201D""\2018""\2019";
}
blockquote:before {
color: #ccc;
content: open-quote;
font-size: 3em;
line-height: 0.1em;
margin-right: 0.25em;
vertical-align: -0.4em;
}
blockquote:after {
color: #ccc;
content: close-quote;
font-size: 3em;
line-height: 0.1em;
margin-right: 0.25em;
vertical-align: -0.4em;
}
I want the quotes inline with the content rather than above and below, so used
blockquote p {
display:inline;
}
this works perfectly if I only have one paragraph of text, however if i have multiple then it loses the paragraphs as I have specified p to all be inline.
How do I get the quotes to sit inline without losing paragraphs?