Forums

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

Home › Forums › CSS › Rendering differences between Chrome and Safari

  • This topic is empty.
Viewing 5 posts - 1 through 5 (of 5 total)
  • Author
    Posts
  • October 4, 2016 at 9:13 am #246144
    css_confused
    Participant

    Hello,

    I am developing a Flexbox based static homepage for a website http://www.sibeliusnaturalproducts.com/ and I can’t seem to figure out how to get the code to work on Safari.

    On chrome it renders how I expect, but on Safari, the image stretches and distorts and doesn’t work correctly.

    I’ve added vendor prefixes, but that hasn’t helped. The main image of the test tubes just doesn’t seem to obey the “height:100%” rule I have set it.

    All the relevant CSS is embedded in the page itself, I hope someone can work out what the problem is because I am at a loss. Perhaps it was just foolish to try and use Flexbox in the first place since it is still a bit of a new standard.

    I’d appreciate any help with this!

    Best,

    css_confused

    October 4, 2016 at 9:15 am #246145
    css_confused
    Participant

    I’m having problems with responsiveness I should add – both of them appear how I expect on a 1080p desktop monitor, it’s only when you change the browser size or try mobile devices that the problems occur.

    October 4, 2016 at 9:17 am #246146
    Paulie_D
    Member

    You haven’t said which version of Safari and most versions still require vendor prefixing.

    Regardless, without a minimal demo (not a link to a site) it’s hard to offer any assistance.

    October 4, 2016 at 9:28 am #246147
    css_confused
    Participant

    Sorry! Here is a demo (is this what you mean?) . As you can see, the test tube height is not change correctly on Safari.

    http://codepen.io/anon/pen/WGXYyk

    I am using Version 52 of Chrome and Version 9.1.1 of Safari on a Mac. Ignoring older versions for a minute – it would be great to even get this to work on these up to date browser versions.

    Best,

    css_confused

    October 10, 2016 at 5:45 am #246385
    css_confused
    Participant

    Does anyone have any ideas about this?

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