Comparing code for OOCSS and Atomic CSS

atomic-vs-oocss.html

<!--
Example: A simple list component with each item as a block one below other with some padding and border.
-->

<!-- Atomic CSS -->
<ul class="MB(baseSpacing)  Bgc(#0280ae)">
  <li class="P(halfBaseSpacing) BdB(1px)"></li>
  ...
</ul>

<!-- OOCSS
The styles have been defined in CSS. Eg.
.block-list { margin-top: $base-spacing; background-color: #0280ae; }
.block-list > li { padding: $half-base-spacing; border-bottom: 1px; }
-->
<ul class="block-list">
  <li></li>
  ...
</ul>