2010-12-13 6 views
1

Ok, quelqu'un dans le cosmos doit connaître la réponse à cela.Enveloppe de mot et espace blanc compatibles avec le navigateur: pré? (prendre 2)

J'ai déjà posé cette question ici mais toujours pas de solution.

J'ai besoin de texte dans une div pour être conservé et emballé. Jusqu'à présent, j'ai du mal à trouver une solution. La meilleure solution que j'ai pu trouver ne fonctionne pas pour tous les navigateurs.

Les travaux suivants dans Chrome et IE6 +, mais dans Firefox le texte ne s'enroule pas.

white-space: pre; 
word-wrap: break-word; 

J'ai trouvé que pour une raison quelconque, le texte ne s'enroulait pas dans Firefox avec un espace blanc: pré. Et -moz-pré-wrap ne fonctionne pas dans Firefox 3.5 (pourquoi ??), seulement pré-wrap. MAIS quand j'ajoute pré-wrap à la liste, IE 6 et 7 ne fonctionnent pas. Très frustrant.

Le code:

.introsub { 
    position: relative; 
    top: 30px; 
    left: 25px; 
    width: 550px; 
    font-weight: normal; 
    line-height: 1.5em; 
    overflow: auto; 
    margin: 0; 
    padding: 1.5em; 
    white-space: pre; 
    word-wrap: break-word; 
} 

Aussi, j'ai essayé:

white-space: -moz-pre-wrap; /* Firefox */ 
white-space: -pre-wrap; /* ancient Opera */ 
white-space: -o-pre-wrap; /* newer Opera */ 
white-space: pre-wrap; /* Chrome; W3C standard */ 
word-wrap: break-word; /* IE */ 

et il ne fonctionne pas dans IE6 ou 7.

Merci

+0

Est-ce que la question différente de http://stackoverflow.com/questions/4413015/browser-compatible-word-wrap-and-whitespace- pré? –

+0

Vous voulez que le texte soit conservé? Que veux-tu dire par là? En outre, les DIVs enveloppent le texte par défaut. –

+0

J'ai besoin de sauts de ligne, pas tellement d'espaces entre les lettres. Il s'enroule par défaut mais ne conserve pas les sauts de ligne dans le texte. Donc, si le div contient du texte où il a deux lignes avec 5 lignes vides, il sera conservé. Ce n'est pas pour afficher le code. @Alvaro c'est la même question. – Logan

Répondre

2

J'ai utilisé depuis un certain temps:

div{ 
    white-space: pre-wrap; 
    font-family: monospace; 
} 
+0

Je ne sais pas si 'font-family: monospace;' fait la différence ici, mais 'white-space: pre-wrap;' a fonctionné pour moi seul. –

+0

@MichaelBremerkamp Non, la police à espacement fixe n'est pas liée à l'effondrement des espaces blancs, elle est seulement là pour afficher le code source (un cas d'utilisation typique) d'une manière lisible. –

0

Il travaillera en IE8 +, Chrome, FF et Safari

div { 
    white-space: pre; 
    word-wrap: break-word; 
} 
@-moz-document url-prefix() { 
    div { 
     white-space: normal !important; 
    } 
}