これはバグ?仕様?Windows10の無償アップデート終了からはや1週間経ちました。うちのアホ会社の土壇場でのPCのアップデートが結構大変でしたが、それもどうにかこうにか終わりホッと一息ついていましたが・・・。Edgeを触ってみて、EdgeのCSSのバグ?仕様?なものに気づいた。CSSの書き方の問題もあるのでバグと言い切るには微妙で、仕様にしては「えー?」となる問題だったので、気づいたこととしてとりあえず書いておきます。前にIE6の呪縛から解放されて、それから割と頻繁に使っていたposition:fixed。スマホChromeで位置算出が変だったり他、何かと問題を起こしやすいこのスタイルですが・・・。Edgeでも「あ!」と気づいた。fixedをかけた子要素を配置すると、親要素のウィンドウ追従がガタつく。class="fix2">子要素</div></div>上記の指定では、.fix1の追従がガタつきます。確かにこんなことをするのはだいぶ特殊ですが・・・こりゃないよ。fixed、子要素にp等要素を入れ、その後でinline-block要素を複数配置して1つ目のinline-block要素だけにfloatをかける。fixedは、この例の場合、fixedをかけた要素はinline-blockの子要素の長さに応じて収まるように変わるはずだが・・・。なんとEdgeの場合、これが収まらない。IE7~11では起きなかった事象である。他のモダンブラウザでも起きない。<div>子要素2</div></div>上記の指定の場合、.base以降がカラム落ちする。:hover&color&transitionの継承が複雑になった際の事象このブログでも起きている事象です。更新前に「え!?」となった。スタイル継承を利用して複雑に:hover擬似要素で、colorとbackground-colorとtransitionを重ねると継承前の色が途中出てきたり、transitionを無視してテキスト色が変わったりする。いうか、普通に何の継承もない場合でもたまーに起きたりするのでなんじゃこりゃ。Cromeを意識した作りをしているみたいです。久しぶりにMicrosoft頑張ったなーとは思ったんですが・・・お家芸とまで言えるIEのオレオレ仕様はやはり健在のようですね・・・。これらで触れたのは氷山の一角でしょうけど、3項めが結構衝撃的で、IE11の時に比べてCSS3の機能関係が弱くなった気がします。IE10~11でCSS3はほぼサポートされてたのに、それまでのノウハウはいずこへ・・・。IE9~10への過渡期みたいな印象ですね。今後のアップデートに期待しましょう。カテゴリHTML/CSSこの記事のコメントコメントはないです。コメントをキャンセルメールアドレスが公開されることはありません。*サイト次回のコメントで使用するためブラウザーに自分の名前、メールアドレス、サイトを保存する。