I have created a SCSS mixin based on the Bootstrap LESS mixin that will create a diagonally striped background. However, no matter how big I make the "tile" for the stripe, there always seems to be a 1px mis-alignment. I'm guessing that it has something to do with sub-pixel calculations, but I'm wondering if someone can point me in the right direction.

<http://codepen.io/allicarn/pen/ncHod>

![Screenshot of codepen](https://i.stack.imgur.com/3T5hA.png)

Here's a screenshot of the codepen (Chrome) with one repetition of the background highlighted. Basically the 1px artifact originates from either edge not matching up to the next "tile"

Another goal would be to modify the angle and have it work, but that's just bonus points ;)