jmwhittaker

.container {
  font-family: helvetica, sans-serif;
  padding-right:30px; /* Same padding as the img required */
}

.item {
  display: inline-block;
  text-align:left;
  padding-right:30px; /* Same padding as the img required */
  background:url(  "http://www.lorempixel.com/30/30") no-repeat center right; /* set img as background & position */

jmwhittaker

// ----
// Sass (v3.4.4)
// Compass (v1.0.1)
// ----

$small6: 6;
$small7: 7;
$small8: 8;
$small9: 9;

jmwhittaker

<div class="box box--blue u-padding-A--12">
  <p class="u-text--16">Hello World</p>
</div>

<div class="box box--red u-padding-V--8">
  <p class="u-text--10">Hello World</p>
</div>

jmwhittaker

body {
  background-color: #CED6DC;
}

.switch {
  position: relative;
  padding-bottom: 10px;
}

/* switch component */