Как я могу использовать CSS для вставки разрыва строки после, но не перед элементом?

Например:

HTML:

The quick brown fox <span class="break">{BREAK}</span> jumps over the lazy dog.

Я хочу, чтобы это отображалось:

Быстрая коричневая лиса {BREAK}

прыгает через ленивую собаку.

Я просмотрел свойство display, но display:inline; не разбивается нигде, а display:block помещает перерывы с обеих сторон.

Я также просмотрел псевдокласс класса :after, но .break:after{content:"\000A";} завершает рендеринг как пробел, а не строку.

Ответ 1

По умолчанию элементы HTML игнорируют пробелы.
Вам нужно изменить это:

.break:after {
    content:"\000A";
    white-space: pre;
}

Ответ 2

http://jsfiddle.net/bMKrc/1/

html:

The quick brown fox <span class="break"></span> jumps over the lazy dog.

CSS

.break{
    display:block;
}

И это все, что вам нужно. display:block может привести к его разрыву с обеих сторон, но это не приведет к появлению дополнительной строки. Посмотреть мою скрипку.