Skip to content

Instantly share code, notes, and snippets.

@ryanve
Last active February 16, 2017 04:02
Show Gist options
  • Star 1 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save ryanve/a867fe73ab053deb5d1f06d4562a975b to your computer and use it in GitHub Desktop.
Save ryanve/a867fe73ab053deb5d1f06d4562a975b to your computer and use it in GitHub Desktop.
Namespacing CSS libraries

Imagine a web application that uses multiple CSS frameworks, libraries, components, etc. Class names are bound to conflict. Imagine two libraries: freeform.css and aid.css

Namespaced by prefixing classes

<a class="freeform-text--bold freeform-display--block aid aid--focusable">example</a>

Namespaced by data attribute

<a data-freeform="text--bold display--block" data-aid="focusable">example</a>

Which is cleaner?

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment