Comment puis-je utiliser les CSS pour insérer un saut de ligne après mais pas avant un élément?

Par exemple:

HTML:

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

Je veux ce à afficher:

The quick brown fox {PAUSE}

saute par-dessus le chien paresseux.

J'ai regardé dans le display propriété, mais display:inline; ne casse pas n'importe où et display:block met des pauses sur les deux côtés.

J'ai aussi regardé dans le :after pseudo-classe, mais .break:after{content:"\000A";} finit rendu comme un espace plutôt qu'un saut de ligne.

jsfiddle.net/bMKrc Comme ceci? Vous pouvez également, dans ce cas, il suffit d'utiliser les divs.
Non, sans modifier la structure HTML.
Est-il une raison pourquoi vous ne vous contentez pas d'utiliser <br> en HTML?
Je veux qu'il soit personnalisable si il y a un saut de ligne ou pas.
SLaks solution est bonne, mais vous pourriez juste faire le span.break affichage du bloc. Il est plus facile, moins de code, et de la croix-navigateur compatible.jsfiddle.net/bMKrc/1

OriginalL'auteur Matt | 2013-09-30

  1. 30

    Par défaut, les éléments HTML ignorer les espaces blancs.

    Vous devez changement:

    .break:after {
    content:"
    .break:after {
content:"\000A";
white-space: pre;
}
    0A"    ;
    white-space: pre;
}
    Merci, cela fonctionne! Je vais accepter dès que les 15 minutes.
    dans mon cas, il n'a pas de travail, sauf si je met le texte en il pourquoi?!
    De quoi parles-tu? Ce qui s'est passé?
    Pourriez-vous expliquer ce que cela est en train de faire s'il vous plaît? Je viens de trouver la réponse, et il fonctionne, mais je veux comprendre ce qu'il fait. (S'il vous plaît et merci :))
    href="https://developer.mozilla.org/en-US/docs/Web/CSS/white-space" >developer.mozilla.org/en-US/docs/Web/CSS/white-space

    OriginalL'auteur SLaks

  2. 3

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

    html:

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

    CSS:

    .break{
    display:block;
}

    Et c'est tout ce dont vous avez besoin. display:block peut provoquer des ruptures sur les deux côtés, mais il ne cause pas là pour être une ligne supplémentaire. La vue de mon violon.

    Veuillez lire la question avant de répondre.
    Tout simplement parce que l'OP dit que quelque chose ne signifie pas que c'est vrai. Vous atteindre le résultat souhaité avec affichage du bloc. Découvrez mon violon si vous ne me croyez pas.
    Dans le cas où il est source de confusion "{PAUSE}" est toujours censé être une partie du texte.
    Oh, ça ne fait pas beaucoup de sens, mais ce n'est pas mon projet. Je pensais qu'il était de montrer où mettre la pause. Mais cela ne garantit pas votre être impoli.
    ..soo, pourquoi ne pas utiliser <br> alors?

    OriginalL'auteur Jacques