I have a bunch of nested quotes I want to display, but I find (see the attached example below) that the spacing between quotes is too small. How do I increase this?
HTML:
<blockquote>stuff
<blockquote>neato</blockquote>
</blockquote>
CSS:
blockquote {
border-left: 1.5px solid #ccc;
color: #888;
margin: 0 0 10px 0;
padding: 0 0 0 12px;
}
Here's an interactive example: http://codepen.io/anon/pen/bNKZVo?editors=110
In that example I find the spacing under "neat" and the next quote is too tight and I'd like more room. I tried line-height
, but while the spacing between them eventually gets better, (around 50 line height) it makes the second quote of an absurd height.
If you want to add margin top to nested bloquote do exactly that, in CSS you can express that as:
blockquote blockquote {margin-top:10px}
This way there is no margin on the top level bloquote, but all the nested do get it.