alt131 - 2:02 am on Aug 3, 2011 (gmt 0)
Css: Presumably you're using the <pre> to take advantage of the default white-space:pre. Setting that on a block element works as desired except for ie7&8 which create a text-indent on the first line. white-space:pre-line/pre-wrap aren't understood by ie7, but produce the same display as white-space:pre in ie8.
In terms of separating the <pre> and <script> elements by a space (or newline), and seeing that reflected in the formatting, I believe that is correct. The 16.6 of the css recs say:
and 9.1 of the html recs expressly exempt pre from the expectation visual user agents will "collapse" white-space that is "unnecessary". So any whitespace/newline inside <pre> should produce the results described - although note that per 9.3.4 of the html recs the characteristics of <pre> are not mandatory.
This value prevents user agents from collapsing sequences of white space. Lines are only broken at preserved newline characters.
So back to where this began - <pre> with white-space:pre as the default. What fascinated me is that clicking on the first line expands the element to display all the output, formatted exactly as desired! Pre-line/pre-wrap produce the same affect. Adjusting overflow and anything else likely to be relevant don't correct the issue either.
What does work is pre:before, best with not even a space for content to avoid having to deal with browser variations on handling nil content. pseudo elements for ie have white-space:pre-line set by default, so that's useful information to explore at some stage.
However, that "collapsing" plus pseudo's working leads directly to a display issue, and setting display:table-row or display:list-iterm on the <pre> solves the issue without any affect on other browsers.
So I can't explain why, maybe this will prompt someone else. Fascinating, and I've flagged it to explore later.