SVG android resizing hack

Android doesn't support background-size percentages so a pseudo element must be used instead with background size cover.

by Soviut

HTML

<div id="box">test</div>

CSS

#box {
    position: relative;
    width: 100px;
    height: 100px;
    background: red;
    
    ;
    background-size: 35%;
}

#box:before {
    content: '';
    display: block;
    position: absolute;
    top: 50%;
    left: 50%;
    width: 35%;
    height: 35%;
    
    background: url(http://dev.w3.org/SVG/tools/svgweb/samples/svg-files/acid.svg) center center no-repeat;
    background-size: contain;
    -webkit-transform: translate(-50%, -50%);
}