ついにInternet Explorerのサポートが終了しましたね。
先月のことですけど。
「IEで崩れています」という聞いた瞬間に血圧が50くらい上がる言葉をもう聞かなくて済むと思うと仕事が楽しくなりますね。
なるかな。ならんな。

せっかくIEが滅んだのでIE11をガン無視したコーディングをしたいですよね。

というわけで小ネタを一つ……
よくある「YouTubeの埋め込みのレスポンシブ対応」です。こんなん。

IE11が生きていた世界では、外側のdivのheightを0にしてpadding-topを56.25%（動画が16：9の場合）にして、内側のiframeをposition: absoluteで配置する方法が一般的だったと思います。
こんなん。

<div class="youtube">
  <div class="inner">
    <iframe...>
  </div>
</div>

.youtube{
  width: 90%;
  max-width: 640px;
  margin-left: auto;
  margin-right: auto;
}
.inner{
  position: relative;
  width: 100%;
  height: 0;
  padding-top: 56.25%;
}
.inner > iframe{
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  hegiht: 100%;
}

YouTubeの動画を、親要素の幅90%、最大幅640pxでセンター配置する感じのコードです。
めんどうくさいですね。

IEをガン無視する場合は以下のようなコードでOKです。

<div class="youtube">
  <iframe...>
</div>

.youtube{
  width: 90%;
  max-width: 640px;
  aspect-ratio: 16 / 9;
  margin-left: auto;
  margin-right: auto;
}
.youtube > iframe{
  width: 100%;
  height: 100%;
}

IE11では使えなかったaspect-ratioプロパティを使えばすぐです。
こいつで要素の比率を指定できます。
いやー、楽ちんですね。

aspect-ratioプロパティの詳しい説明はこちら。
https://developer.mozilla.org/ja/docs/Web/CSS/aspect-ratio

まぁ、だいぶ前からこの方法もいろんなところで紹介されてますけどね……
IEが死んだので改めてね……

では。