Nicely formatted source code [closed]

Question

The source code is already formatted using newline characters and whitespace.

Goals:

1. keep source formatting as long as lines fit in the screen horizontally (e.g. pre)
   • show line numbers on the left side aligned with the lines (e.g. a table with line numbers in a separate column)
   • break lines into multiple lines when they do not fit in the screen (e.g. doable with white-space: pre-wrap)
   • never merge whitespace or newline characters (e.g. pre does that)
   • for lines that break either show the line number multiple times or just once at the top (e.g. align the line numbers top)
   • for lines that break show a small marker image at the end and/or at the beginning (e.g. use background image per line, but for that I need to make the pre elements separate)
   • allow selecting and copy/pasting a couple of lines with the mouse without including the line numbers (e.g. a single pre gives this, but otherwise this seems to be impossible)
   • outputting HTML and CSS from the server-side, but preferrably without JavaScript

I can't make it supporting all the above points, seems like it's impossible. I tried using div, table, pre in various combinations, with white-space: pre-wrap and so on, but had no luck having all the options.

What's a simple solution?

Answer 1

An ordered list does a decent job. Opera doesn't copy the line numbers with it, but I think other browsers might do.