nucliweb
2/24/2015 - 3:49 PM

Generated by SassMeister.com.

Generated by SassMeister.com.

<ul class="list-bullet-icon">
  <li class="lolo iconfont-A">a</li>
  <li>b</li>   
</ul>
.list-bullet-icon [class^="iconfont-"], .list-bullet-icon [class*="iconfont-"] {
  position: relative;
}
.list-bullet-icon .iconfont-16px {
  padding-left: 26px;
}
.list-bullet-icon .iconfont-18px {
  padding-left: 28px;
}
.list-bullet-icon .iconfont-22px {
  padding-left: 32px;
}
.list-bullet-icon .iconfont-30px {
  padding-left: 40px;
}
.list-bullet-icon .iconfont-100px {
  padding-left: 110px;
}
// ----
// Sass (v3.4.12)
// Compass (v1.0.3)
// ----


$iconfont-size: (16, 18, 22, 30, 100);

.list-bullet-icon {
    & [class^="iconfont-"],
    & [class*="iconfont-"] {
        position: relative;
    }
    @each $val in $iconfont-size {
      & .iconfont-#{$val}px {
        padding-left: #{$val + 10}px;
      }
    }
}
<ul class="list-bullet-icon">
  <li class="lolo iconfont-A">a</li>
  <li>b</li>   
</ul>