Eu notei uma coisa estranha no ios ao usar o svg. Os svgs parecem funcionar bem em todos os outros navegadores, mas no Safari ipad / iphone a caixa de exibição possui algum espaço estranho na parte superior e inferior do svg. Alguém mais se deparou com isso e você conseguiu consertar isso? Usando algum código svg simples, como:

<svg width="100%" viewBox="0 0 20 10">
    <polygon fill=red stroke-width=0 points="0,10 20,10 10,0" />
</svg>

No ipad / iphone se eu colocar uma borda no svg existe um espaço estranho acima e abaixo do svg ... ??

a qualidade do violino parece normal na área de trabalho, mas se você a observar em um ipad etc., verá os problemas.

http://jsfiddle.net/InVAMPED/hck5gg1a/