fake-nth-child-mixin.scss

// Fake the :nth-child(#) selector shim for ie8
// @author Jasper Palfree <http://wellcaffeinated.net>
// finders props to Graham Losee
// ---------------------------------------------------
// limited functionality, only works for 
// strictly numeric $n values and child
// elements must be of the same type.
// $sel is the type of selector.
// $extend is the class (or selector)
// to @extend from.
// 
// usage example:
// 
// @include fake-nth-child(3, 'li', '.my-class');
// 
// is the ie8 compatible version of:
// 
// li:nth-child(3){
//      @extend .my-class;
// }
// 
// better usage example:
// 
// @include fake-nth-child(2, 'li', 'li:nth-child(2)');
// 
// would be a way to get your nth-child(2) selector
// to work in ie8.
// 
// Adapted from: http://stackoverflow.com/questions/8492121/ie8-nth-child-and-before 
@mixin fake-nth-child($n, $sel, $extend) {
    $inc: '';
    @for $i from 2 through $n {
        $inc: $inc + '+ ' + $sel;
    }

    #{$sel}:first-child #{$inc} {
        @extend #{$extend};
    }
}

Even if you don't use the mixin... the strategy might help...

It seems that this doesn't work: @include fake-nth-child(2, 'li', 'li:nth-child(2)');
http://fiddle.jshell.net/97gz2/