少しずつ CSS を調整しながら何とか WordPress テーマを作成。iNove をベースとして可変レイアウトに対応する。手を付けるべき部分はまだ色々あるので今後も改良を続けたい。

ただし元の iNove テーマでもそうなのだが Firefox だとフォントなどのサイズ算出が IE や WebKit 系と異なるため、厳密なピクセル指定に依存している部分が崩れる。Web デザインとしては可変レイアウト、相対サイズ指定が理想。しかし SVG のようなベクター グラフィックが普及するまでは固定ピクセルの呪縛から逃れられない。

WPF はこういう問題を踏まえて設計されているのだろう。デバイス非依存ピクセルはよい設計だ。

ところで原因は不明だが、これまでの記事で SyntaxHighlighter Evoled による表示がおかしくなっていたので修正した。

SyntaxHighlighter はページが表示された時に JavaScript で不等号や引用符などを文字実体参照へ置き換えるのだが、なぜか処理後の状態で表示されてしまった。現象を要約すると以下となる。

1. コードの特定文字が文字実体参照に変換される
2. ページを表示
3. ページ中のコードが pre タグに囲まれる
4. pre タグ中の文字実体参照が純粋な文字列として表示される
5. コードが壊れているように見える

過去記事をひととおりチェック & 修正したけれど、もっと記事が増えた後に再発したらと思うとゾッとする。後で投稿のリビジョンを追ってきちんと原因を調べたい。