The forums ran from 2008-2020 and are now closed and viewable here as an archive.

Home Forums CSS How to stop SVG images in safari not keeping their width

  • This topic is empty.
Viewing 2 posts - 1 through 2 (of 2 total)
  • Author
  • #240641

    Hi guys,

    If you see my site here: under the ‘Welcome to PapayaPods!’ title you will see six content blocks each with an SVG icon in an image tag. In chrome and firefox their widths are fine, yet in safari they seem to adopt a 100% width even though the icon isn’t that wide, pushing the text too far left. Giving the image a fixed width fixes this, but I want them responsive and to use the max-height I’ve used. Do you guys have a solution to propose?

    Many thanks


    Only thing I can think of is the padding-bottom hack for SVG as an image; see a demo here ; but this does require some extra HTML-markup, and changing the padding-bottom for each image according to the width/height proportions of the image.

Viewing 2 posts - 1 through 2 (of 2 total)
  • The forum ‘CSS’ is closed to new topics and replies.