This topic contains 11 replies, has 2 voices, and was last updated by  tikaram 8 months, 1 week ago.

Viewing 12 posts - 1 through 12 (of 12 total)
  • Author
    Posts
  • #129516

    Jubo
    Participant

    Hey, I just created a site with Parallax Frame and it looks really good – everywhere except on retina iPads in landscape format.
    Desktop view:
    desktop view
    iPad header:
    iPad header
    iPad body:
    iPad body

    I’ve been messing around with all the screen size settings I could find in the style.css file, but I can’t figure out what part of it the iPad is using.
    Can anyone help me, please? I really don’t want to have to configure a different theme because of this.

    #129517

    Jubo
    Participant

    Seems like img isn’t working. How about links?
    desktop view
    iPad header
    iPad body

    • This reply was modified 8 months, 2 weeks ago by  Jubo.
    #129534

    tikaram
    Participant

    @jubo : Please post in your site URL.

    Regards,
    Tikaram

    #129556

    Jubo
    Participant

    oh, right, sorry: site URL
    thank you for looking into it!

    • This reply was modified 8 months, 2 weeks ago by  Jubo.
    #129671

    tikaram
    Participant

    @jubo : I don’t seem to find any issue on your site. Can you please specify the model of the device that you are using. Let me know if you have any further issues.

    Regards,
    Tikaram

    #129697

    Jubo
    Participant

    It’s two different devices: an ipad 4 and an ipad pro 9,6″…
    I’ve also tried out different window sizes with chrome and firefox, and I’ve noticed that between the 1200-something and 1100-something (sorry, I’m on the phone and can’t look up the code right now) – breaking point, it breaks up the navbar and search icon into 3 rows.
    I can sort of force fix that with some unelegant custom css if I have to, but what I really can’t figure out is why the header picture gets blown up to like 500% on both ipads. They seem to be using the 1100-something screensize, but this doesn’t happen on any desktop browser I’ve tried, and changing the header image size in the style.css doesn’t affect it at all. Any ideas where it might come from?

    …and more importantly how to fix it. I can sort of figure out html and css a bit, but everything else is just way beyond me. XD

    • This reply was modified 8 months, 1 week ago by  Jubo.
    #129808

    Jubo
    Participant

    Okay, so I’ve fixed the navbar (the translation plugin was causing the problem), and I found out the iPad is using the screen size it’s supposed to – 1100px (iPad Landscape).
    Now I’ve tried adding #header-featured-image and changing its properties… I CAN hide the header image, for example – but nothing I do is having an effect on the size of the image. In any desktop browser it looks perfectly fine, only the iPads are scaling it to about 500% in Safari, Firefox and Chrome.

    #129828

    tikaram
    Participant

    @jubo : Please try deactivating all plugins and follow this link to know more about plugin conflict with our themes.
    Please try clearing cache as well after deactivating plugins. Let me know if the problem still persist.

    Regards,
    Tikaram

    #129837

    Jubo
    Participant

    Even with all plugins deactivated, cache cleared and in private mode the problem is still there. Everything’s fine except header and footer pictures are scaled way up.
    I tried a few other themes, they were working fine. After changing back to Parallax Frame the issue was back.
    I also downloaded a fresh version of Parallax Frame and tried it without customization – no luck. the issue seems to be with the theme, nothing else. As far as I can tell anyway…

    Thanks for all the help, I’ll just start over with another theme I guess. 🙁

    #129840

    tikaram
    Participant

    @jubo : Go to Appearance => Customize => Additional css and add the following css. The css is intended for iPad.

    @media only screen
    and (min-device-width : 768px)
    and (max-device-width : 1024px)
    and (orientation : landscape) {
    	.parallax-effect {
    		background-attachment: scroll;
    	}
    }

    Let me know if this makes any difference.

    Regards,
    Tikaram

    #129863

    Jubo
    Participant

    WOOOOO! That did it!

    Thank you so much, you’re awesome! *big hug*

    #129911

    tikaram
    Participant

    Hello, there,
    I hope I was able to resolve your issue. If it’s not too much trouble, I have a quick request: could you please leave an honest review?
    https://wordpress.org/support/theme/parallax-frame/reviews/#new-post
    Your review will help others know what to expect when they’re looking for the support I offer. Even a sentence or two would be hugely appreciated.
    Thanks, and if there’s anything else at all that I can do to help, don’t hesitate to let me know.

    Regards,
    Tikaram

Viewing 12 posts - 1 through 12 (of 12 total)

The topic ‘Layout issues on iPad’ is closed to new replies.