閉じる

IE11に対応させる場合はCSS Grid Layoutを利用しない方がいいかも

昨年からCSS Grid Layoutで作成されるサイトが少しづつ増えてきました。
Bootstrapを主に使用してきた人間達にも好評のようです。

管理人はこのブログ(Jen Simmons)でCSS Gridを知りましたが半信半疑でした。以前のGridを想像していたからです。
しかし、実際に記載してみるとHTMLとCSSが簡単に記載でき、いままでのレイアウトをより自由に構築できるのです。
横並びを簡単に配置できるflexboxよりCSS Gridが主流になるかもしれません。

CSS Grid LayoutのIE11適応問題

CSS Grid Layoutは、縦横自由に配置できます。

1
2
3
4
5
6
7

シンプルな2カラムや3カラムのレイアウトなら、かなりシンプルなコードになりますし複雑なレイアウトも短時間で可能になるかもしれません。
ただし、IE11に対応させる場合が問題です。

上記の例もIE11でみると1カラム表示となります。

これぐらいだったらベンダープレフィックスで対応可能ですが、凝ったレイアウトでは-ms-などベンダープレフィックスが効かないケースもあります。

複雑なレイアウトの場合はIEにもCSS Grid Layout適応できるjava scriptなどが開発されるまではflexboxでページを作成した方がよいかもしれません。

関連記事

  1. chrome hosts

    Chromeでhosts設定を行える拡張機能

  2. chrome

    2017年9月の日本でのブラウザシェアとChrome62のフォー…

  3. サイト内検索機能をGoogleカスタム検索で設置する

  4. TCD

    WordPressでポータルサイトを簡単に作成できるテーマ(テン…

  5. LinkChecker

    ホームページ、htmlのリンク切れをチェックできるサービスとツー…

  6. GOOGLE日本語フォント

    GoogleFonts日本語 テスト公開中

ピックアップ記事

  1. Classic Editor
  2. Hacking Alert! You account was hacked
  3. サーチコンソール
ページ上部へ戻る