SVG with PNG fallback for IE8
All browsers that support SVG background images also supports multiple background images.
CSS
.module {
background: url('logo.png');
background: none, url('logo.svg');
}
SASS
$public_path: ./;
@mixin vector-bg-with-fallback($name) {
background-image: url('#{$public_path}images/#{$name}.png');
background-image: none, url('#{$public_path}images/#{$name}.svg');
}
Sourec : Ben Schwarz.
Written by Gaurav Jassal
Related protips
1 Response
Android 2.3 and below didn’t support SVG but did support multiple-background, this would probably reset the first PNG background-image definition to none.
over 1 year ago
·
Have a fresh tip? Share with Coderwall community!
Post
Post a tip
Best
#Css
Authors
Sponsored by #native_company# — Learn More
#native_title#
#native_desc#