Paul Hammond is wondering how to mark up blocks of code in HTML. He references a few methods, such as <pre>...</pre>, or <p><code>...</code></p>. His worries with the first method are that preformatted text destroys layouts, and that it's an uneasy mix of presentation and markup. I can't help the first, but I'm more prepared to have a layout broken than I am to have code break onto two lines, since an awful lot of languages are intolerant of that sort of thing. My solution to this when I post code blocks is <pre><code>...</code></pre>. I've seen people set <code> to display: block in stylesheets, but that breaks if you want to write some code inline (as with that little CSS snippet just there).
And this is Marking up blocks of code, written , and concerning Uncategorized
Comments
Kilroy Balore, Cyberfox
iX
surely he meant
...
Sam
I use code (or samp as appropriate) and use CSS to set white-space to pre. Now that I check the Master Grid, I see that apparently this doesn’t work in IE5/Win. Oh well. Can’t confirm, as I only have IE6 handy.
Simon Willison
Surely you mean
...
Greetings,Huh! I ran into this just recently, as I started trying to put code into my LJ. In fact, I found that the
white-space: predoes NOT work in IE5 (what I was testing with), and in fact, unfortunately, the font used in Mozilla and IE5 are different for <pre> and <code>, which was especially frustrating. Mozilla has a very nice fixed width font for <code>, but for <pre> it uses its normal font. All told, I had to go through a lot to make reasonably cross-browser-readable code segments.I shouldn't have to, but...there it is.The URL above is a link to my page about CSS and code/pre blocks. Not much more there than here, except some sample code, and how to set it up on an LJ.-- Kilroy Balore, CyberFOX!