Why SASS + Compass is teh awesome...

awesome.scss

// The yummy goodness that made this go REAALLLLY fast
@import "smilies/*.png";
@include all-smilies-sprites;

.smiley {
   @include inline-block;
   &.large {
      height: smilies-sprite-height(red-large);
      width: smilies-sprite-height(red-large);
      &.red { @include smilies-sprite(red-large); }
      &.yellow { @include smilies-sprite(yellow-large); }
      &.green { @include smilies-sprite(green-large); }
   }
   &.medium {
      height: smilies-sprite-height(red-medium);
      width: smilies-sprite-height(red-medium);
      &.red { @include smilies-sprite(red-medium); }
      &.yellow { @include smilies-sprite(yellow-medium); }
      &.green { @include smilies-sprite(green-medium); }
   }
   &.small {
      height: smilies-sprite-height(red-small);
      width: smilies-sprite-height(red-small);
      &.red { @include smilies-sprite(red-small); }
      &.yellow { @include smilies-sprite(yellow-small); }
      &.green { @include smilies-sprite(green-small); }
   }
}

less_awesome.css

/* Compiled CSS...that I didn't have to type out... */
.smilies-sprite, .smilies-green-large, .smilies-green-medium, .smilies-green-small, .smilies-red-large, .smilies-red-medium, .smilies-red-small, .smilies-yellow-large, .smilies-yellow-medium, .smilies-yellow-small, .smiley.large.red, .smiley.large.yellow, .smiley.large.green, .smiley.medium.red, .smiley.medium.yellow, .smiley.medium.green, .smiley.small.red, .smiley.small.yellow, .smiley.small.green {
  background: url('../images/smilies-s6cf465e420.png') no-repeat;
}
.smilies-green-large {
  background-position: 0 0;
}
.smilies-green-medium {
  background-position: 0 -266px;
}
.smilies-green-small {
  background-position: 0 -354px;
}
.smilies-red-large {
  background-position: 0 -74px;
}
.smilies-red-medium {
  background-position: 0 -222px;
}
.smilies-red-small {
  background-position: 0 -382px;
}
.smilies-yellow-large {
  background-position: 0 -148px;
}
.smilies-yellow-medium {
  background-position: 0 -310px;
}
.smilies-yellow-small {
  background-position: 0 -410px;
}
.smiley {
  display: -moz-inline-box;
  -moz-box-orient: vertical;
  display: inline-block;
  vertical-align: middle;
  *vertical-align: auto;
}
.smiley {
  *display: inline;
}
.smiley.large {
  height: 74px;
  width: 74px;
}
.smiley.large.red {
  background-position: 0 -74px;
}
.smiley.large.yellow {
  background-position: 0 -148px;
}
.smiley.large.green {
  background-position: 0 0;
}
.smiley.medium {
  height: 44px;
  width: 44px;
}
.smiley.medium.red {
  background-position: 0 -222px;
}
.smiley.medium.yellow {
  background-position: 0 -310px;
}
.smiley.medium.green {
  background-position: 0 -266px;
}
.smiley.small {
  height: 28px;
  width: 28px;
}
.smiley.small.red {
  background-position: 0 -382px;
}
.smiley.small.yellow {
  background-position: 0 -410px;
}
.smiley.small.green {
  background-position: 0 -354px;
}