Как увеличить расстояние между различными частями блок-кодов с помощью CSS?

Question

У меня есть куча вложенных кавычек, которые я хочу отобразить, но я нахожу (см. Прилагаемый пример ниже), что расстояние между кавычками слишком мало. Как это увеличить?

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; 
} 

Вот интерактивный пример: http://codepen.io/anon/pen/bNKZVo?editors=110

В этом примере я нахожу интервал под "аккуратным" и следующей цитатой слишком туго и мне хотелось бы больше места. Я пробовал line-height, но в то время как расстояние между ними в итоге становится лучше (около 50 строк), он делает вторую цитату абсурдной высоты.

Answer 1

Если вы хотите добавить маржу сверху вложенной bloquote сделать именно это, в CSS вы можете выразить, что, как:

blockquote blockquote {margin-top:10px} 

Таким образом, нет маржи на верхнем bloquote уровня, но все вложенных дела возьми.

Answer 2

насчет нового CSS блока:

blockquote > blockquote { 
    margin-top: 20px; 
} 

Это будет влиять только на вложенные цитаты, а не на высшем уровне один.