Skip to content

Instantly share code, notes, and snippets.

@s4wny

s4wny/The new BEM.html

Last active December 19, 2015 17:48
Show Gist options
  • Save s4wny/5994139 to your computer and use it in GitHub Desktop.
Save s4wny/5994139 to your computer and use it in GitHub Desktop.
Download ZIP
Brainstorming new better ways to write *great* CSS that is re-useable. Inspired by BEM.
Raw
The new BEM.html
<div class="button button--green button--large island island--header">
<div class="button--green button--large island--header">
DRY:
<div class="button--green--large island--header">
<div class="button --green --large island --header">
<div class="button +green +large island +header">
<div class="!button +green +large !island +header">
<div class="\button +green +large \island +header">
<div class="$button +green +large $island +header">
<div class="#button +green +large #island +header">
<div class="~#button +green +large ~#island +header">
<div class="@button +green +large @island +header">
<div class=">button +green +large >island +header">
<div class=";button +green +large ;island +header">
<div class="button: +green +large island: +header">
<div class="button: +green +large island: +header">
<div class="#button: +green +large #island: +header">
<div class="$button: +green +large $island: +header">
<div class="Button: +green +large Island: +header">
<div class="!button: +green +large !island: +header">
<div class="button: -green -large island: -header">
<div class="button: green large <> island: header">
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment