閉じる

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

本ページはプロモーション・広告が含まれています。

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

管理人はJen Simmons氏のブログ(http://jensimmons.com/)で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. reCAPTCHA

    フォームの迷惑メール対策で有効なGoogle「reCAPTCHA…

  2. chrome68

    Chrome68から非SSLサイトに「保護されていません」の警告…

  3. GOOGLE MAPのカスタマイズに必要なAPIキーの取得

  4. SSH接続で使える初心者のためのUnix/Linuxコマンド

  5. WEBサイトの制作やネットショップ作成で利用できる2021年の補…

  6. 病院

    産婦人科、歯医者など病院のホームページ制作に最適なWordPre…

ピックアップ記事

  1. reCAPTCHA
  2. 日本語設定
ページ上部へ戻る