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
53
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
48
Team Communication Through Code
Avatar for Rachel Ober rachelober
0
77
Responsive Emails
Avatar for Rachel Ober rachelober
0
41
What I Learned About SVG
Avatar for Rachel Ober rachelober
0
55
Paperless Post Sass
Avatar for Rachel Ober rachelober
1
89

Other Decks in Programming

See All in Programming
Microservices Platforms: When Team Topologies Meets Microservices Patterns
Avatar for Chris Richardson cer
PRO
0
190
AI 時代だからこそ抑えたい「価値のある」PHP ユニットテストを書く技術 #phpconfuk / phpcon-fukuoka-2025
Avatar for shogogg shogogg
1
580
Honoを技術選定したAI要件定義プラットフォームAcsimでの意思決定
Avatar for Tadashi Shigeoka codenote
0
250
Duke on CRaC with Jakarta EE
Avatar for ivargrimstad ivargrimstad
0
160
Reactive Thinking with Signals and the new Resource API
Avatar for Manfred Steyer manfredsteyer
PRO
0
110
OSS開発者の憂鬱
Avatar for Yusuke Wada yusukebe
12
5.5k
PHPライセンス変更の議論を通じて学ぶOSSライセンスの基礎
Avatar for Atsushi Matsuo matsuo_atsushi
0
170
Java_プロセスのメモリ監視の落とし穴_NMT_で見抜けない_glibc_キャッシュ問題_.pdf
Avatar for NTTドコモソリューションズ　Java担当 ntt_dsol_java
0
220
Querying Design System デザインシステムの意思決定を支える構造検索
Avatar for ikuma-t ikumatadokoro
1
1.2k
ゼロダウンタイムでミドルウェアの バージョンアップを実現した手法と課題
Avatar for つっつん wind111
0
210
Promise.tryで実現する新しいエラーハンドリング New error handling with Promise try
Avatar for おおいし bicstone
3
800
[SF Ruby Conf 2025] Rails X
Avatar for Vladimir Dementyev palkan
0
290

Featured

See All Featured
What’s in a name? Adding method to the madness
Avatar for Product Marketing Alliance productmarketing
PRO
24
3.8k
Done Done
Avatar for chrislema chrislema
186
16k
XXLCSS - How to scale CSS and keep your sanity
Avatar for Zaharenia Atzitzikaki sugarenia
249
1.3M
GraphQLとの向き合い方2022年版
Avatar for Yosuke Kurami quramy
49
14k
Designing for humans not robots
Avatar for Tammie Lister tammielis
254
26k
GraphQLの誤解/rethinking-graphql
Avatar for sonatard sonatard
73
11k
Music & Morning Musume
Avatar for Bryan Veloso bryan
46
7k
Why You Should Never Use an ORM
Avatar for John Nunemaker jnunemaker
PRO
60
9.6k
The Pragmatic Product Professional
Avatar for Laura Van Doore lauravandoore
36
7k
4 Signs Your Business is Dying
Avatar for Josh Pigford shpigford
186
22k
Building a Modern Day 
E-commerce SEO Strategy
Avatar for Aleyda Solis aleyda
45
8.1k
Balancing Empowerment & Direction
Avatar for Lara Hogan lara
5
760

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