SVG changes color in Safari | Sololearn: Learn to code for FREE!
New course! Every coder should learn Generative AI!
Try a free lesson
0

SVG changes color in Safari

I've got an SVG background-image. In Safari browser on big screens (like 2560×1440) it changes the color from violet to red. How to fix it?

3rd Sep 2020, 7:00 AM
Sona Sarkisian
Sona Sarkisian - avatar
5 Answers
+ 1
Its better to post svg code so we can solve the problem.
3rd Sep 2020, 7:56 AM
Abdul Azeez
Abdul Azeez - avatar
0
The color of svg board/page can be change by css svg{background:green;} For svg element you can use element name{ fill:green; }
3rd Sep 2020, 8:05 AM
Divya Mohan
Divya Mohan - avatar
0
This is the SVG image code: https://code.sololearn.com/WrSOnM9M4h9X/?ref=app It is used this way: .elem { background: url("image.svg") no-repeat center center; background-size: 109% 100% } Then I added the same properties with -webkit- prefixes also, but it had no effect.
3rd Sep 2020, 8:22 AM
Sona Sarkisian
Sona Sarkisian - avatar
0
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" id="Layer_1" x="0px" y="0px" viewBox="0 0 30 30" style="enable-background:new 0 0 30 30; background:green;" xml:space="preserve"> <style type="text/css"> I have added bacground property to change background. try it in style attribute as shown above
3rd Sep 2020, 8:26 AM
Divya Mohan
Divya Mohan - avatar
0
To change the color of icon/image try this change <style type="text/css"> .st0{fill:red;} .st1{fill:red; stroke:#FFFFFF;stroke-width:0.5;stroke-miterlimit:10;} </style> set desired colored to fill of .st0 and .st1
3rd Sep 2020, 8:31 AM
Divya Mohan
Divya Mohan - avatar