The problem is that line breaks are treated in a special way inside a
PRE block. Outside a PRE block line breaks count as normal space
characters and therefore they should be ignored before/after end tags or
start tags because usually one would add line breaks into the source
code just there to make the code more readable. Also any sequence of
space characters, tabs and line breaks (the so called "white spaces")
will be treated as a single space character.
Inside a PRE block, line breaks characters and all other "white space"
characters are treated differently. They do not copllapse into a single
space character, and line breaks must be displayed where they occur and
won't convert into a space character. So I think that Firefox and Safari
don't display your test page correctly.
The problem seems to be the "display:table" for the PRE tag, which
is confusing Firefox and Safari. This is probably a bug in these
browsers.
I assume that you want to use display:table to make the box a small as
needed. Without the modified display property the box would span the
available width completly. You could make the box a float instead and
"clear" it afterwards to get the same effect. And then all browsers
would display it right.
|