Safari のプレビューを改善しました。

実際に使用すれば何の問題もないテンプレートですが、プレビューが崩れてちゃあ話にならないので、あちこちうろついて原因を探しました。
困るのは、「プレビューだけ崩れる」なんて記事がないこと。
そこで考えました。
プレビューで崩れるのは私のテンプレートだけ。ということは、何かが他とは違っているはずだ。

忍者ツールズがしたようにHTMLを入れてみると、確かに普通に表示されたので、何かがSafari と合わないのだろうことは想像がつきます。
それで、忍者のテンプレートの中で異常が見られるものを探してみました。
でも、みんな正常・・・・・・おや？
私のほどではありませんが、異常が出るものを見つけました。そして、そのテンプレートと私のに共通していることは・・・・・・

XHTMLでした！

そして、CSSに「HTML」と 「* 」が使われているものは正常なのもわかりました。
どうしてプレビューにだけこういう不具合が出るのかは未だに分りませんが、HTMLとXHTMLがごっちゃになっているのが原因である可能性が大きいです。
ともかく理由がわかったのだから訂正も可能です。
早速すべてのテンプレートのCSSに下記の空指定を書き加えました。

* { }

これを入れてからプレビューを見てみると、すべて正常に表示されました。
プレビューのためだけにテンプレートを修正するのもおかしな話ではありますが、あの崩れ方はあまりに酷い。
ついでに、気になっていた細かいところも修正しておきました。
これでやっと心安らかに寝られる（笑）

Safari の皆さん、よろしくお願いしますねー