Upgrade to Pro — share decks privately, control downloads, hide ads and more …

There will be grid - Why CSS Grid Layout May Be...

Avatar for Marco Pantaleo Marco Pantaleo
March 26, 2017
Technology
0
440

There will be grid - Why CSS Grid Layout May Be The Portal Into A New World

held at JSUnconf 2017

Avatar for Marco Pantaleo

Marco Pantaleo

March 26, 2017
Tweet

Other Decks in Technology

See All in Technology
職種の壁を溶かして開発サイクルを高速に回す~情報透明性と職種越境から考えるAIフレンドリーな職種間連携~
Avatar for daitasu daitasu
0
190
エンジニアリングマネージャーの成長の道筋とキャリア / Developers Summit 2025 KANSAI
Avatar for KASUYA, Daisuke daiksy
3
1.1k
Firestore → Spanner 移行 を成功させた段階的移行プロセス
Avatar for a-thug athug
1
500
新アイテムをどう使っていくか？みんなであーだこーだ言ってみよう / 20250911-rpi-jam-tokyo
Avatar for Akira Ouchi akkiesoft
0
350
スマートファクトリーの第一歩 〜AWSマネージドサービスで 実現する予知保全と生成AI活用まで
Avatar for wanda ganota
2
320
Oracle Cloud Infrastructure IaaS 新機能アップデート 2025/06 - 2025/08
Avatar for oracle4engineer oracle4engineer
PRO
0
110
組織を巻き込む大規模プラットフォーム移行戦略 〜50+サービスのマルチリージョン・マルチプロダクト化で学んだステークホルダー協働の実践〜 / Platform migration strategy engaging all stakeholders
Avatar for Toshinori Sugita toshi0607
2
200
メルカリIBISの紹介
Avatar for ktykogm 0gm
0
410
テストを軸にした生き残り術
Avatar for KNOWLEDGE WORK / 株式会社ナレッジワーク kworkdev
PRO
0
220
JTCにおける内製×スクラム開発への挑戦〜内製化率95%達成の舞台裏/JTC's challenge of in-house development with Scrum
Avatar for AEON aeonpeople
0
270
5分でカオスエンジニアリングを分かった気になろう
Avatar for Aja9tochin pandayumi
0
260
COVESA VSSによる車両データモデルの標準化とAWS IoT FleetWiseの活用
Avatar for Yuto Osawa osawa
1
400

Featured

See All Featured
How GitHub (no longer) Works
Avatar for Zach Holman holman
315
140k
XXLCSS - How to scale CSS and keep your sanity
Avatar for Zaharenia Atzitzikaki sugarenia
248
1.3M
Refactoring Trust on Your Teams (GOTO; Chicago 2020)
Avatar for Rebecca Miller-Webster rmw
35
3.1k
ピンチをチャンスに：未来をつくるプロダクトロードマップ #pmconf2020
Avatar for Aki / @LoveIdahoBurger aki_iinuma
127
53k
Git: the NoSQL Database
Avatar for Brandon Keepers bkeepers
PRO
431
66k
Exploring the Power of Turbo Streams & Action Cable | RailsConf2023
Avatar for Kevin Liebholz kevinliebholz
34
6k
Embracing the Ebb and Flow
Avatar for Simon Collison colly
87
4.8k
Improving Core Web Vitals using Speculation Rules API
Avatar for Sergey Chernyshev sergeychernyshev
18
1.1k
It's Worth the Effort
Avatar for 3n 3n
187
28k
Testing 201, or: Great Expectations
Avatar for Joseph Mastey jmmastey
45
7.7k
Making Projects Easy
Avatar for Brett Harned brettharned
117
6.4k
The Cult of Friendly URLs
Avatar for Andy Hume andyhume
79
6.6k

Transcript

  1. ere will be grid. Why CSS Grid Layout May Be

    e Portal Into A New World Marco Pantaleo @peeofive

  2. Hi, I’m Marco. •42 years old •Frontend Developer •…since 2001

    I work here —>

  3. Why a talk about Grid Layout?

  4. tl;dr: It’s awesome. …and then some.

  5. Let’s get back in time…

  6. logo.html navigation.html main.html footer.html

  7. Frames easy to use not accessible at all bad for

    search engines include content you don’t own
  8. None

  9. T able layout easy aligning & centering „interesting“ layouts table

    hell only good for fixed layouts
  10. None

  11. CSS Layout Zen Garden & A List Apart floats, clears

    display inline-block browser incompatibilities (hi IE6)

  12. en in 2013…

  13. Flexbox super flexible :) caniuse: green but only in one

    direction e grid is a lie.
  14. None
  15. None

  16. Now let’s code.

  17. None
  18. None
  19. None
  20. None
  21. None
  22. None
  23. None
  24. None
  25. None
  26. None
  27. None
  28. None
  29. None
  30. None

  31. Back to the real world…

  32. None

  33. Many other features Alignment Justification shorthands …

  34. None

  35. anks.