SitePoint Sponsor

User Tag List

Results 1 to 8 of 8
  1. #1
    SitePoint Enthusiast Ray_bman's Avatar
    Join Date
    Jul 2003
    Location
    Los Angeles, CA
    Posts
    60
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Responsive site displays well on other phones, EXCEPT Iphones 4 and 5...why?

    Could use some help on this...

    The site displays fine (vertically) in Android and most other phones, EXCEPT Iphones 4 and 5.

    Iphone squeezes the page into the screen rather than resize responsively. I have a responsive layout with media queries in
    various break points.

    I have been testing in Google's Developer Emulator and see that Iphone seems think the width is 980px which is not
    set like that anywhere in the stylesheet.

    site: tali(removethis)ankode(removethis)signgroupdotcom

    Maybe some fresh eyes could spot the problem, or maybe someone has had the same problem and has a solution.

    I did submit this issue on the CSS forum, but don't know if it really is a CSS issue or something else...

    Any thoughts or hints would be appreciated.

    Ray
    Last edited by Paul O'B; Feb 10, 2014 at 10:23. Reason: de-linked

  2. #2
    It's all Geek to me silver trophybronze trophy
    ralph.m's Avatar
    Join Date
    Mar 2009
    Location
    Melbourne, AU
    Posts
    24,200
    Mentioned
    456 Post(s)
    Tagged
    8 Thread(s)
    Iphone squeezes the page into the screen rather than resize responsively.
    The layout fits the screen nicely on iPhone4S for me. What are you expecting to see? It's not clear what you mean above.

    For more control of the layout on small devices, you can use @media rules. I don't see any in your main style sheets.

  3. #3
    The CSS Clinic is open silver trophybronze trophy
    Paul O'B's Avatar
    Join Date
    Jan 2003
    Location
    Hampshire UK
    Posts
    40,367
    Mentioned
    180 Post(s)
    Tagged
    6 Thread(s)
    Threads merged

    I've just done a quick test using the mac simulator and I can see that the site is not applying the media queries properly and is just scaled to fit as though you had omitted the viewport meta tag.

    The problem seems to be connected with the simpleviewer script you have in place and if I remove references to that script then the page reformats properly on the iphone(simulator) . So the first thing to try is just to remove that script and test to see if this really is the cause. If so then you will need to contact the support section of the simpleviewer site as this a paid for product and should be fully supported.

  4. #4
    The CSS Clinic is open silver trophybronze trophy
    Paul O'B's Avatar
    Join Date
    Jan 2003
    Location
    Hampshire UK
    Posts
    40,367
    Mentioned
    180 Post(s)
    Tagged
    6 Thread(s)
    Quote Originally Posted by ralph.m View Post
    For more control of the layout on small devices, you can use @media rules. I don't see any in your main style sheets.
    Ralph, the site is redirected to mobile so you can't easily test on a desktop. You can get a chrome extension that lets you spoof the header and see the mobile code.

  5. #5
    SitePoint Enthusiast Ray_bman's Avatar
    Join Date
    Jul 2003
    Location
    Los Angeles, CA
    Posts
    60
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Paul, you nailed it, thank you, I did not catch that.

    So, I was able to dequeue the simpleviewer script for this mobile theme, and it is now displaying correctly.

    The simpleviewer plugin is only for the desktop version of the site which we will eventually evolve away form.

    Thank you again.


    P.S. sorry for the double post, I wish I could now remove the URL, but only a mod can do that...

  6. #6
    The CSS Clinic is open silver trophybronze trophy
    Paul O'B's Avatar
    Join Date
    Jan 2003
    Location
    Hampshire UK
    Posts
    40,367
    Mentioned
    180 Post(s)
    Tagged
    6 Thread(s)
    Quote Originally Posted by Ray_bman View Post
    P.S. sorry for the double post, I wish I could now remove the URL, but only a mod can do that...
    As a general rule we don't remove links but I have de-linked and obfuscated it so it shouldn't show up in search engines.

  7. #7
    SitePoint Enthusiast Ray_bman's Avatar
    Join Date
    Jul 2003
    Location
    Los Angeles, CA
    Posts
    60
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by Paul O'B View Post
    As a general rule we don't remove links but I have de-linked and obfuscated it so it shouldn't show up in search engines.
    Your awesome, thank you again.

  8. #8
    It's all Geek to me silver trophybronze trophy
    ralph.m's Avatar
    Join Date
    Mar 2009
    Location
    Melbourne, AU
    Posts
    24,200
    Mentioned
    456 Post(s)
    Tagged
    8 Thread(s)
    Quote Originally Posted by Paul O'B View Post
    Ralph, the site is redirected to mobile so you can't easily test on a desktop. You can get a chrome extension that lets you spoof the header and see the mobile code.
    Thanks Paul. I can also plug the phone into the computer and view source via Safari. Should have tried that before.


Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •