Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
Momma's got a brand-new grid, in Albuquerque.
Search
Mary Baum
January 20, 2018
Design
150
2
Share
Embed
Copy iframe code
Copy JS code
Copy link
Start on current slide
Momma's got a brand-new grid, in Albuquerque.
Mary Baum
January 20, 2018
More Decks by Mary Baum
See All by Mary Baum
Genesis or TwentyTwenty?
marybaum
0
43
Confessions of a type nut: Quick tricks to get great type on your site, and why it matters
marybaum
1
76
Let's get visual!
marybaum
0
440
Confessions of a type nut: Quick tricks to get great type on your site, and why it matters
marybaum
1
420
My favorite design tool ... is a browser.
marybaum
0
67
Let's Get Visual!
marybaum
0
260
Themes_101.pdf
marybaum
0
280
Gutenberg.pdf
marybaum
0
150
Header logos and favicons!
marybaum
0
210
Other Decks in Design
See All in Design
保育現場にAIを 〜人と技術に橋を架けるデザインで考えてきたこと〜 uiuxcamp2026-hoiku-ai-design
hiro93n
1
360
1000人規模の組織でデザインハーネスを導入するための第一歩
pkshadeck
PRO
4
3.3k
空間アプリ開発のフィードバックをCodexにするための抽象的なデザインツールの模索
karad
0
170
JBUG大阪#9_登壇資料_引き継ぎで困らないためのBacklogWikiの整え方_ミスと属人化を防ぐために、 “次の人が動ける状態”をどう残すか
webnaut
1
210
【CEDEC2026】派手さと見やすさは両立できる!『Shadowverse: Worlds Beyond』エフェクト・3D背景の超進化したビジュアル設計
cygames
PRO
0
1.3k
デザインとフロントエンドの境界が融ける Claude Code × Figma
littlebusters
2
3.3k
トランジションの冒険 自分と世界を変える冒険の書 / Transition Adventure
dmattsun
2
290
デザインツールを開く前に その画面は誰に何と言わせたい?受託UIデザイナーが顧客解像度を高める 「打ち合わせの場での確かめ方」
garyuten
1
160
組織で働く大人が「知らないままにやってみる」を取り戻す方法とその意味〜企業で働く実務家による実践知の言語化を事例とした考察〜
chiemitaki
1
290
タイル紹介サイト「タイルだもんで」
calpin
0
170
ISO 9241-171:2025っていうのがあってな
shosira
1
240
Decksh keywords
ajstarks
0
110
Featured
See All Featured
VelocityConf: Rendering Performance Case Studies
addyosmani
332
25k
The Spectacular Lies of Maps
axbom
PRO
1
910
We Analyzed 250 Million AI Search Results: Here's What I Found
joshbly
1
1.8k
Taking LLMs out of the black box: A practical guide to human-in-the-loop distillation
inesmontani
PRO
3
2.3k
Claude Code どこまでも/ Claude Code Everywhere
nwiizo
66
57k
The World Runs on Bad Software
bkeepers
PRO
72
12k
Building a Scalable Design System with Sketch
lauravandoore
463
34k
DBのスキルで生き残る技術 - AI時代におけるテーブル設計の勘所
soudai
PRO
68
56k
Building AI with AI
inesmontani
PRO
1
1.1k
Facilitating Awesome Meetings
lara
57
7.1k
[RailsConf 2023] Rails as a piece of cake
palkan
59
6.9k
Lightning talk: Run Django tests with GitHub Actions
sabderemane
0
230
Transcript
Who's your favorite?
None
Style That Site! “I can style it in three breakpoints!”
None
None
None
None
New unit! The fraction. 1fr, 2fr, 3fr, more.
None
None
Now let’s pay some dues.
We’re here for two reasons. Rachel Andrew Jen Simmons
A tiny taste: http:// labs.jensimmons.com/
A tiny taste: http://gridbyexample.com
And so much more.
So. Grid.
What is it? Where do we use it? Does it
work with Flexbox? How to get started?
What it’s not:
A plugin A framework A page-builder A panacea (much)
Grid is a CSS specification.
Where do we use it?
Grids of posts ...
instead of Flexbox; instead of floats; instead of block and
inline-block;
Instead of Flexbox.
None
None
None
Or along with those things!
Thanks, Foundation. You taught me some great php.
None
How about inside a post? For this theme, I scrapped
the image-gallery plugins.
None
None
None
None
None
None
Why, yes! You can mix units.
None
Does it work with Flexbox?
None
None
None
Browser support?
None
The implicit grid.
None
None
None
Mary Baum @marybaum