変なの

昨日の夜から雨。

朝も、お昼前位まで雨だった。

雨が止むと結構すぐに、太陽が顔を見せてくれた。

雨のお陰で、夜中も日中も、気温は高めだった。

太陽が出ると、 更にあったかく感じた。

CSSを触っていて、うん？と思うことがあった。

Firefox、Chrome(Vivaldi、Iron、Min)では問題ないのに、Chromium版Edgeだけ、表示がおかしかった。
(IEでも確認してみたけれど、全く問題ないという「奇跡」！(笑))

CSSが効く効かない以前の問題で、divのidやclassを認識していない。

Chromeできちんと表示されているのだから、Chromium版Edgeも問題ないと思うよね？

それが違っているという。変なの．．．

お試しでやっていたことなので、深入りするのは止めた。
よって、原因はわからない。

という感じだったけれど、数日経過すると、Chromium版のEdgeでも反映されていた。

どういうこと？

どうやら、キャッシュが関係していたようだ。

強制的にキャッシュをクリアしているつもりだった。

Firefoxでは、Shiftキーを使う。
Edgeでも同じだと思ってやっていたのだけれど、そうではなかったようだ。

Edgeでは、Ctrlキーを使うとのこと。

別件で、また反映されていないものがあったので、Ctrlキーを使ってキャッシュクリアすると、きちんと反映された。

なーんだ、そういうことか。

Edgeって、頑固にキャッシュを優先するんだね。
Firefoxだと、ファイルが更新されたら、ほとんどの場合、それを読み込んでくれているんだけれどね。

ちなみに、キャッシュの強制削除は、こういうショートカットキーらしい。

Edgeは、「Ctrl + F5」「Ctrl + リロードボタン」。
Firefoxは、「Ctrl + F5」「Ctrl + Shift + R」「Shift + リロードボタン」。

これで、とりあえず、この件は解決。

そのEdgeのCSSの効き方を見ていて、余計なことをしているなぁ、と思うことがあった。

「ユーザー エージェントのスタイル シート」というのがあって、いくつかのCSSの要素に、デフォルトで値が指定されている。

このせいで、他のブラウザと違う表示になる。

ほとんどの人は、IEのCSSで泣かされたと思うけれど(今回は驚きがあったけれど(笑))、このEdgeもそういう感じなのか？！

こういうブラウザ標準のCSSをリセットするCSSがあるようで、それを導入しないと、全てのブラウザで同じ表示にするのは難しいようだ。

Chromiumがベースだから、Chromeと同じだろう、と思っていたら大間違いであった。

内部的に結構触っているんだねぇ。

動作確認、表示確認とも、以前と同じように、それぞれのブラウザでしないといけないようだ。

あ、あと、Androidのブラウザでも表示が微妙に違っているものがあった。

Androidのブラウザって、基本、Chromiumベースじゃないの？