« Back to Index

Sass: referencing parent selector

View original Gist on GitHub

Sass.md

http://thesassway.com/intermediate/referencing-parent-selectors-using-ampersand

h3 {
    font-size: 20px
    margin-bottom: 10px
    
    .ie8 & {
        font-size: 24px
        margin-bottom: 20px
    }
}

…produces…

h3 {
    font-size: 20px
    margin-bottom: 10px
}

.ie8 h3 {
    font-size: 24px
    margin-bottom: 20px
}

…perfect for keeping IE related style fixes together (rather than bunching them up at the bottom of your main rule)