Saturday, December 2nd, 2006
Wrapping the pre tag
Making preformated
text wrap in CSS3, Mozilla, Opera and IE
is the tip that let's you use the pre tag to keep the formatting, without cursing yourself when some of the content is too long and doesn't wrap:
CSS:
-
-
/* Browser specific (not valid) styles to make preformatted text wrap */
-
pre {
-
white-space: pre-wrap; /* css-3 */
-
white-space: -moz-pre-wrap; /* Mozilla, since 1999 */
-
white-space: -pre-wrap; /* Opera 4-6 */
-
white-space: -o-pre-wrap; /* Opera 7 */
-
word-wrap: break-word; /* Internet Explorer 5.5+ */
-
}
-
4 rating from 50 votes
[...] 用 <pre></pre> 如果é‡åˆ°æ–‡å—éŽé•·çš„時候就會炸掉，çµæžœå‰›å‰›åœ¨ Wrapping the pre tag 這篇看到解法： pre { white-space: pre-wrap; /* css-3 */ white-space: -moz-pre-wrap; /* Mozilla, since 1999 */ white-space: -pre-wrap; /* Opera 4-6 */ white-space: -o-pre-wrap; /* Opera 7 */ word-wrap: break-word; /* Internet Explorer 5.5+ */ } [...]
Now I know for sure that you are subscribed to my del.icio.us feed. ;-)
Mise en forme du tag "pre"
J’ai eu besoin d’afficher des bouts de code source il y a quelques jours au moyen du tag …. Or sous Internet Explorer, les lignes trop longues débordent et mettent le bronx dans la structure de la page en décalant toute la…
this doesnt seem to change the text for me… ?
[...] Wrapping the pre tag (tags: HTML webdesign css) [...]
yay, thing is, i can’t think of anything i can apply this to other than my blog, which i rarely post to anyway.
[...] is the tip that let’s you use the pre tag to keep the formatting, without cursing yourself when some of the content is too long and doesn’t wrap: /* Browser specific (not valid) styles to make preformatted text wrap */ pre { white-space: pre-wrap; /* css-3 */ white-space: -moz-pre-wrap; /* Mozilla, since 1999 */ white-space: -pre-wrap; /* Opera 4-6 */ white-space: -o-pre-wrap; /* Opera 7 */ word-wrap: break-word; /* Internet Explorer 5.5+ */ } via http://ajaxian.com/archives/wrapping-the-pre-tag [...]
There is problem with this that if the PRE tag is inside the table cell it will not work properly. Inorder for thaat to work you need to wrap it in UL >LI element
so you would have
TABLE > UL> LI> >PRE
Works in IE and FF haven’t check others.
This css is not working for Mac OS safari browsers..It is a big annoying issue in safari. Do u have any solution for PRE wrap in safari browser?