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

Object-Oriented CSS

Avatar for Rachel Ober Rachel Ober
April 12, 2013
Programming
1
43

Object-Oriented CSS

Avatar for Rachel Ober

Rachel Ober

April 12, 2013
Tweet

More Decks by Rachel Ober

See All by Rachel Ober
So, You Want to Organize a Conference
Avatar for Rachel Ober rachelober
0
51
Front End Workshop 2015
Avatar for Rachel Ober rachelober
0
67
Front End Overview for Interns 2015
Avatar for Rachel Ober rachelober
1
47
IE Classes
Avatar for Rachel Ober rachelober
0
49
Front End Overview (2014)
Avatar for Rachel Ober rachelober
0
46
Team Communication Through Code
Avatar for Rachel Ober rachelober
0
74
Responsive Emails
Avatar for Rachel Ober rachelober
0
41
What I Learned About SVG
Avatar for Rachel Ober rachelober
0
50
Paperless Post Sass
Avatar for Rachel Ober rachelober
1
89

Other Decks in Programming

See All in Programming
Cloudflare AgentsとAI SDKでAIエージェントを作ってみた
Avatar for Sato Naoya briete
0
100
CSC305 Lecture 03
Avatar for Javier Gonzalez-Sanchez javiergs
PRO
0
230
Go Conference 2025: Goで体感するMultipath TCP ― Go 1.24 時代の MPTCP Listener を理解する
Avatar for Takeru Hayasaka takehaya
7
1.6k
そのpreloadは必要？見過ごされたpreloadが技術的負債として爆発した日
Avatar for mugi mugitti9
2
3k
プログラミングどうやる？ ～テスト駆動開発から学ぶ達人の型～
Avatar for Atsushi Okui a_okui
0
190
Go言語の特性を活かした公式MCP SDKの設計
Avatar for hond hond0413
1
190
階層構造を表現するデータ構造とリファクタリング 〜1年で10倍成長したプロダクトの変化と課題〜
Avatar for yuhi yuhisatoxxx
3
920
ИИ-Агенты в каждый дом – Алексей Порядин, PythoNN
Avatar for Sobolev Nikita sobolevn
0
150
Advance Your Career with Open Source
Avatar for ivargrimstad ivargrimstad
0
350
Web フロントエンドエンジニアに開かれる AI Agent プロダクト開発 - Vercel AI SDK を観察して AI Agent と仲良くなろう！ #FEC余熱NIGHT
Avatar for Masayuki Izumi izumin5210
3
410
Breaking Up with Big ViewModels — Without Breaking Your Architecture (droidcon Berlin 2025)
Avatar for Stelios Frantzeskakis steliosf
PRO
1
330
ABEMAモバイルアプリが
Kotlin Multiplatformと歩んだ5年 ─ 導入と運用、成功と課題 / iOSDC 2025
Avatar for Akio Yasui akkyie
0
330

Featured

See All Featured
Embracing the Ebb and Flow
Avatar for Simon Collison colly
88
4.8k
Visualization
Avatar for Eitan Lees eitanlees
148
16k
Into the Great Unknown - MozCon
Avatar for Noah Learner thekraken
40
2.1k
Connecting the Dots Between Site Speed, User Experience & Your Business [WebExpo 2025]
Avatar for Tammy Everts tammyeverts
9
580
Navigating Team Friction
Avatar for Lara Hogan lara
189
15k
Designing Experiences People Love
Avatar for Jonathan Moore moore
142
24k
Statistics for Hackers
Avatar for Jake VanderPlas jakevdp
799
220k
Imperfection Machines: The Place of Print at Facebook
Avatar for Scott Boms scottboms
269
13k
Side Projects
Avatar for Sacha Greif sachag
455
43k
Save Time (by Creating Custom Rails Generators)
Avatar for Garrett Dimon garrettdimon
PRO
32
1.6k
Designing for humans not robots
Avatar for Tammie Lister tammielis
254
25k
The Web Performance Landscape in 2024 [PerfNow 2024]
Avatar for Tammy Everts tammyeverts
9
850

Transcript

  1. Object-Oriented CSS

  2. Grid

  3. None

  4. Padding & Margins

  5. app/styles/styleguide/_spacing.scss

  6. None
  7. None

  8. Does that really help us?

  9. Cascading Style Sheets (CSS) Noun A style sheet language used

    for describing the presentation semantics (the look and formatting) of a document written in a markup language.

  10. When I want to change a style, I should only

    touch the CSS, not the HTML

  11. http://ianstormtaylor.com/oocss-plus-sass-is-the-best-way-to-css/

  12. OOCSS + Sass

  13. None
  14. None
  15. None