スタイルキャッチャーの汎用ウェブサイトにあるユニバーサルグリーンというスタイルに変更してみた。これが手ごわい。今までにないスタイルで、サイドが少し幅広（幅300ピクセル）の2カラムになっている。
まず、サイドメニュー（ウィジェット）のタイトル部分にheader-arrow-medium.gifの背景画像がうまくおさまらない。本来の角丸のイメージが、上3分の1ほど表示されずに欠けてしまう。イメージの大きさは幅300×高20ピクセルで、スタイルシートではウィジェットヘッダーがline-height:20px;と設定してあった。本来より高さが4－5px位低くなったイメージの上に、パディングの設定でメニュータイトルをうまく乗せることはできる。が、やっぱり上部の左右が角丸じゃないのは変だよ。(；一_一)
スタイルシートでいろいろやってみたが分からないので、とりあえずは背景色を焦げ茶色にして、イメージはやめた。どうせだからと、エントリータイトルの背景色も同色にしてみた。
そういえば、ヘッダー（ブログタイトル）の下にある苔の画像だが、これが最初は表示されなかった。スタイルシートで#homepage-imageに設定されているが、肝心なhtml（テンプレ）に記述がなかったのでこれをヘッダーディスクリプションの次に追加した。
#homepage-imageには{width:905px; height:170px;}が定義されている。これと同様にサイドのメニュータイトルもwidthとheightを背景イメージの大きさと同じwidth:300px;height:20pxに設定したら、イメージは完璧に表示されるようになった。パディングで調整して文字（メニュータイトル）も正常に表示されるようになった。しかし、実際に表示されているのはwidth:276px;height:15px;ぐらいである。バックグランドカラーを有色にして少しずつ調整していって分かった。これはどこかで縮小するように定義されているのか。同様にコメントヘッダーも調整して終わり。とりあえずカスタマイズはここまで。
それにしてもいつの間にかブログ（閲覧ページ）を表示すると、スクリプトエラーが出るようになった。詳細はライン1、文字列42列だとか。これって1行目のDOCTYPE宣言のこと？ コピペして検索したって、別に間違っている宣言じゃない。他の何かが引っ掛かっているんだろう。もうお手上げ状態。どこが悪いのかさっぱり分からない。同じスタイルで引っ掛かっている人いませんか～。