0

Is it possible to change width of svg in desktop Safari-browser when its applied online in html?

html:

<div id="wrapper">
<svg style="left:100px;" height="300" width="500" ...>
</div>

If I try do like this below in css, the width does not get affected in Safari (it's still 500 pixels). Doesn't Safari support !important-directive in combination with SVG?

css:

#wrapper svg {width:200px !important;}

It seems to work in all other browsers. I have to change the width of the svg and move it left somewhat

css:

#wrapper svg {width:200px !important;left:-50px !important;}

but it doesn't move left and it the width does not get affected (have checked in Safaris own development tool).

I want to change the width and move it somewhat with media-query. I have tested this on Browserstack (service for viewing site in different browser/smartphones/ipads etc) and the project seems to work on iphone5S and later, but not on iphone5.

bestprogrammerintheworld
  • 5,417
  • 7
  • 43
  • 72
  • I can assure you that !important is supported by the browser. It must be something else. Did you check what styles are getting applied in the latter case? – Sooraj Aug 26 '15 at 07:13
  • 1
    See this already existent answer: http://stackoverflow.com/questions/9382434/full-width-and-height-svg – Andrea Salicetti Aug 26 '15 at 07:14

0 Answers0