Hi,
I’m going to implement svg fallbacks for ie using modernizr (see Chris Coyier’s technique at https://css-tricks.com/svg-fallbacks/) which in short is:
`.my-element {
background-image: url(image.svg);
}
.no-svg .my-element {
background-image: url(image.png);
}
`
However, as I've nested rules with SASS, I'm wondering if there's an easy way to check for the .no-svg class from within a nest? That is, so I don't have to go through and write out a load of CSS (I'm trying to be as lazy as possible!)
Here’s an example of my SASS at the moment:
<code></code>.side-nav {
nav {
#nav-blog {
&:before {
background:url(../img/nav/blog.svg) no-repeat 0 8px;
}
}
}
}
`
`
It would be great if I could just write something like:
`.side-nav {
nav {
#nav-blog {
&:before {
background:url(../img/nav/blog.svg) no-repeat 0 8px;
}
& .. .no-svg &:before {
New code here
}
}
}
}`
Any ideas would be appreciated! Thanks,
Jonno
