Why background-repeat: no-repeat doesn't work with .svg images in Opera 12?

css svg opera background-repeat
tonix picture tonix · Dec 28, 2013 · Viewed 13.3k times · Source

I got stuck with a strange problem in Opera 12: I have an .svg image which is linked within my css code. When I resize to zoom-out the page where the image is displayed, Opera repeats the image as if I didn't use the "no-repeat" value in background-repeat. What am I missing?

Here is my css code:

.svgImg {
    background: url("../img/img.svg") no-repeat;
    height:100%;
    width:100%;
}

I also tried this:

.svgImg {
     background: url("../img/img.svg");
     background-repeat:no-repeat;
     height:100%;
     width:100%;
 }

But it didn't work. Why opera does that?

Answer

jeyhun_mikayil picture jeyhun_mikayil · Apr 1, 2021

Try:

background-repeat:no-repeat!important;

Worked for me on Firefox v.88

Related questions

How to change the color of an svg element?

I want to use this technique http://css-tricks.com/svg-fallbacks/ and change the svg color but so far I haven't been able to do so. I put this in the css but my image is always black, no matter what. …

Read More
How to change color of SVG image using CSS (jQuery SVG image replacement)?

This is a self Q&A of a handy piece of code I came up with. Currently, there isn't an easy way to embed an SVG image and then have access to the SVG elements via CSS. There are …

Read More
img src SVG changing the styles with CSS

html <img src="logo.svg" alt="Logo" class="logo-img"> css .logo-img path { fill: #000; } The above svg loads and is natively fill: #fff but when I use the above css to try change it to black it doesn't change, …

Read More