I have forked Zurb's Foundation to use SCSS %placeholder selectors and avoid using column classes in my markup.
You can see here how I generate the placeholders using loops. The thing is, when I extend multiple column placeholders, the "small range" one is compiled at the end instead of first (thus overriding the other selectors).
.main-menu-wrapper {
@extend %small-12;
@extend %medium-6;
@extend %large-6;
}
If I move the medium or large placeholders up and down in the loop, their compile order is changed too (as expected). However, the small ones are always compiled last, no matter where they are placed. The only way I have to make it compile first is to create a separate loop.
Any ideas why this happens?
