Getting OSX Safari to honor css "white-space: pre"

Question

I have a blog where I am using ccs style="white-space: pre" with div elements. I am doing this to display lots of code samples or cli output within the blog.. and have to copy and paste that text into the html pages.

I want the source code to be easily readable, so wish to use "white-space: pre" to preserve the white space formatting of the original output when displayed by the browsers.

Chrome and Firefox display the html pages just fine, but for some odd reason... Safari is doing "pre-wrap" when I ask it to do just "pre". I must have the preserve whitespace and nowrap combined features... which is "pre" but is not being honored by safari for osx.

Does anyone have any workaround for this type of problem? It is clear to me from plenty of testing that firefox and chrome support "pre" as defined by CSS white-space property but safari for osx does not. I do not want to use &nbsp as this makes my source htm difficult to read and manage.

thanks in advance for any HELPFUL advise.

Answer 1

Safari incorrectly makes overflow-wrap (aka word-wrap) apply even when white-space is pre. The spec says it should not apply when wrapping is disallowed in the first place, but Safari seems to ignore that.

So, to fix this, combine white-space:pre with word-wrap:normal, and you should be good.