Habillage de ligne CSS

Donné un bloc conteneur

<div>
 this is a very long string which contains a bunch of characters that I want to break at container edges.
</div>

existe-il des propriétés css, je peux mettre pour le forcer à rompre lorsqu'il atteint la largeur du conteneur, quel que soit le contenu de la chaîne, par exemple une pause comme:

this is a ve
ry long stri
ng which ...

est à peu près ce que je veux. Maintenant, il semble préférer toujours à briser les espaces ou autres caractères spéciaux (tels que /).

source d'informationauteur Mic

  1. 9

    Il y a une propriété CSS3 appelé word-break qui peuvent être de quelque utilité à l'avenir.

    Plus d'informations sont disponibles ici: http://www.css3.com/css-word-break/

    La break-all valeur semble l'être à la chose que vous me demandez:

    Utile lorsque le contenu contient une majorité de caractères Asiatiques de contenu d'ensemble, à laquelle cette valeur se comporte comme "normal". Non-Asiatique jeu de caractères contenu peut être arbitrairement cassé à travers les lignes.

    Pour plus d'versions prises en charge de CSS, je ne crois pas qu'il y a une façon que vous pouvez faire cela.

  2. 4

    Essayer cette

    <style type="text/css">
div {
white-space: -moz-pre-wrap; /* Mozilla, supported since 1999 */
white-space: -pre-wrap; /* Opera 4 - 6 */
white-space: -o-pre-wrap; /* Opera 7 */
white-space: pre-wrap; /* CSS3 - Text module (Candidate Recommendation) http://www.w3.org/TR/css3-text/#white-space */
word-wrap: break-word; /* IE 5.5+ */
}
</style>

<div style="width:200px">
adsjflk;asjfl;kasdjfl;kasdjfl;kasdjf;lkasdjf;lkasdjf;lkasjdf;lkajsd;lkadfjs;l
</div>
  3. 2

    Autre façon d'atteindre le même en entourant la div dans une div parent et le réglage de la largeur de la div parent. Bien qu'il pourrait ne pas être la solution idéale.

    <div style="width:50px">
        <div>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum</div>
        </div>