The Sass mixin example is clean, but you'll end up generating much larger files that way: the preprocessor will repeat the island definition for every single cl

The Sass mixin example is clean, but you'll end up generating much larger files that way: the preprocessor will repeat the island definition for every single class you mix it into, which means that the more useful and reusable your mixin actually is, the more the output will get bloated. The following CSS: .island { display: block; padding: 20px; margin-bottom: 20px; } .header { background-color: #121416; color: #fff; } .content { width: 640px; float: left; margin-right: 20px; } Is roughly as clean, but will make your files much smaller by virtue of not repeating the definitions per class. In general, avoiding property mixins (aside from vendor prefixes) and deep nesting in compile-to-CSS languages helps keep your output small and your pages fast. :)