Forums

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

Home Forums CSS Safari puzzler

  • This topic is empty.
Viewing 13 posts - 1 through 13 (of 13 total)
  • Author
    Posts
  • #155328
    simplybikes
    Participant

    Hi all…below is a link to a test page I’ve put together to try out a responsive grid. All works perfectly well in all browsers however when it comes to Safari all is not well. What happens is that when you resize / scale the page down the slider resizes, all fine and dandy. The issue is that when you scale the page back up the slider does not scale back up, it remains at the smaller size until you refresh the page. I’m baffled by this as it works on FF, Chrome, Opera, IE 9+. For the mobile version I’ve removed the slider completely so no issues there.

    Anybody any clues.

    http://www.nscom.ie/ResponsiveTestSite

    Many thanks,

    Ian.

    #155329
    Paulie_D
    Member

    Which version of Safari?

    #155333
    simplybikes
    Participant

    Hi Paulie_D…the version on my laptop where this is happening is 5.1.7. It also happens on my desktop which may have a slightly newer version.

    Ian

    #155334
    Paulie_D
    Member

    Hmm…I suspect that this is going to be somewhere in the JS.

    Of course, this might be a solution looking for a problem since the only people who actively resize are developers.

    #155335
    simplybikes
    Participant

    I sort of thought the same thing. How many users go around resizing the page up and down. I might just be creating a problem.

    #155337
    Paulie_D
    Member

    Well, I wouldn’t quote go that far.

    Users on mobile devices so, sort of, resize when they change orientation from portrait to landscape and vice versa but the question you need to answer for yourself is “are they losing anything because the slider isn’t exactly right”.

    Then you have to weigh that against how much time you are willing to spend on tracking down exactly what the problem is…and balance that against the relatively small subset of users it will affect.

    #155365
    paulob
    Participant

    HI,

    There is a bug in safari with various elements such as display:table, inline-blocks and occasionally floats.

    You will need to test this has no other adverse effects but the following seems to fix it when using the inspector.:

    .col.slider{float:none}
    
    #155388
    simplybikes
    Participant

    Hi paulob….many thanks for that, I’ll give it a rattle and see what happens. How did you find that?

    #155394
    paulob
    Participant

    How did you find that?

    I knew about the bug as I’ve seen it before and it was a matter of poking about in your code with the inspector and testing out any suitable elements.

    I can’t guarantee it will work as changing code live doesn’t always give the same result as when it’s in the page from the beginning. But it’s worth a try.

    #155670
    simplybikes
    Participant

    Hi paulob….been away for a few days so just put in your suggested fix for this issue. Well you were spot on – it works, bloody brilliant. My sincerest thanks for that.

    If you get the chance could you advise me on a separate issue. The test page doesn’t work in IE8. It’s not responsive (media queries do not work) and the menu is crocked.
    If you have any suggestions they would be appreciated. Once I get this test page fully working I’ll be able to sleep at night!

    My thanks again.

    #155672
    paulob
    Participant

    Hi,

    I assume you have enabled media query support in IE8 as it doesn’t understand it natively.

    http://code.google.com/p/css3-mediaqueries-js/

    I didn’t see it in your code and modernizr only detects for media query support I believe. It doesn’t add it.

    #155674
    simplybikes
    Participant

    Many thanks for that paulob.

    #155682
    simplybikes
    Participant

    That works a treat paulob – once again many thanks.
    Bit of a learning curve happening with the entire responsive think so your help
    is greatly appreciated.

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