You might have noticed, especially given the last post, that the code formatting on this blog leaves much to be desired. I’m trying to rectify that, but I’m not quite sure how to do it.

I’ve always assumed that when presenting code, I should use the the <code> tag. Unfortunately, the default formatting of this tag is indeterminate at best. From trial and error I’ve determined that it’s usually best to put each line of code in its own set of <code></code> tags, otherwise formatting gets really wonked. I’ve also found, depending on the CSS, I might have to put a <br> after each line of code, otherwise my nice, pretty function all ends up on one line.

And this completely ignores indented code. There seem to be a couple of ways to making indentation work. The first is to use the white-space: pre; CSS rule and make sure the tab characters are in the <code> tags. The second is to use the text-indent CSS attribute for each line of code I want to indent.

None of these options are easy or simple, which makes me think I’m doing something wrong. Are there are any web designers/HTML coders in the audience that know the proper way of doing this? Surely it’s not intended to be this painful.

The problem with formatting code on this blog has led me to the conclusion that I’m probably going to have to ditch my current WordPress theme. Sure it’s pretty, but it does float: right on my images with a rule that has high specificity, making it very difficult to not float my images to the right, which is what I usually want. It also has a fixed width, which doesn’t really mix well with my code examples, not to mention it doesn’t style the <code> tags well.

Unfortunately I haven’t been able to to find an appropriate WordPress theme that will fit my needs. I’d really like a two column layout, with a fluid width, and, if it’s not too much to ask, decent <code> tag handling.