Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

SVG as CSS background, problems with zoom level in Opera

I'm having difficulties using SVG background with Opera.

When I zoom out the page, the background starts repeating on the x axis despite `background-repeat: repeat-y'

I created a codepen showing off the problem with the first online SVG image I found.

body {
  background-image: url("http://www.anarchopedia.org/images/2/22/Heckert_GNU_white.svg");
  background-repeat: repeat-y;
}

And here is a screenshot of Opera's 12.14 behavior on my computer:

Opera starts repeating the background on the x axis when zooming out

The behavior exhibits for any SVG document with width="W" height="H" viewBox="0 0 W H" dimensioning.

I tried various values for width, height, viewBox and even preserveAspectRatio on the root <svg> element without much success so far.

Any hint please?

like image 475
Gregory Pakosz Avatar asked Mar 05 '13 10:03

Gregory Pakosz


1 Answers

Its not simple as Opera does not redraw the Image after Resize,

refer this link

this link explains how to force opera to redraw the image after zoom,

I have tried the easy way but not working,

so I think this is the only way to deal with opera bug. Seems it is using MathJax framework,

I hope this may help..

like image 97
MarmiK Avatar answered Sep 17 '22 14:09

MarmiK