CSS tip for offline perlmonks writing

[adrianh]

Quick CSS tip for those who tend to write their longer perlmonks posts in a text editor rather than in a textarea field.

Add the following to the top of your HTML while editing:

<style type="text/css">
code {
    display: block;
    white-space: pre;
    color: red;
}

p > code {
    display: inline;
}
</style>

In a vaguely CSS compliant browser it will cause code blocks to be displayed as pre-formatted blocks, unless they're inside a paragraph tag, where they're displayed inline. I also colour them red, but that's just for taste.

This allows me to happily sit in my editor and see a better approximation of what will appear online in the preview window.

(and don't forget to remove the style tags before you post online)