ココログエディタの生成するタグがブラウザによって異なる件。

いつもはFirefox上で投稿記事を書いていますが、ときどき緊急でそのへんのPCを使うことがあります。Forefoxが入っていない場合、IEやまれにSafariとかChrome何かを使うのですが、どうも投稿後の記事の表示の様子が変なのです。

Firefoxの場合、この記事のように空行を作りながら入力すると、<p>タグが適切に生成されて、通常は行間が空いたように見えます(スタイルシートのデフォの場合)。これは、非常に望ましい状態です。

Cocolog_editor_ff_01

Cocolog_editor_ff_02

これに対してSafariやChromeでは、<div>タグが生成されます。なので、空行も<div>〜</div>になるだけで、スタイルシートのデフォの状態ではまったく空きません。つまり、すべての行が繋がって表示されてしまいます。

Cocolog_editor_safari_01

Cocolog_editor_safari_02

これを防ぐには、空行に全角スペースなどを入れて、高さを持たせるしかありません。でも何だかスマートじゃないですよね?そういったわけで、私はココログでの記事投稿にはFirefoxしか使っていません。

そもそも何でこんな違いが出るんでしょうか?ココログエディタは、何で実装されているんでしょう?

ソースを覗くと、JavaScriptでこつこつ書かれているように見えます。ということは、JavaScriptのブラウザごとの実装で微妙な違いが出てきているということでしょうか。最近のJavaScript事情からいうと、ブラウザの違いでこんなにあからさまな違いは出にくいと思っているのですが…。

まぁとにかく、<div>にされてしまうとあとから大変なので、ここはSafariを使わないようにしているとご理解下さい。やっぱり、Firefoxあたりがいろんな意味で安心かな、と思う次第です。

コメント