Home Forums Arnold WordPress Theme Iphone X and XR does not work with site – But Iphone 8 and XS does

Viewing 5 posts - 1 through 5 (of 5 total)
  • Author
    Posts
  • #23556
    Anteronilo
    Participant
    Purchased
    Expired

    Hello SeaTheme

    As the Anteronilo.se site is more or less ready now (i found some solutions that worked) i have still one question to you.
    When looking at the site using an iPhone X the phone believes it is the desctop version he should show. This does not happen on iPhone Xs or iPhone 8.
    Is there anything generic that i can look at – that you know of?

    (If you look and see the header section with the menue in text – thats wrong – it should only show the menue with the chjaracteristic 3 lines top right

    Please advice.
    Thanks

    #23562
    SeaTheme
    Keymaster
    Purchased
    Expired

    Hi,

    Plz add the custom CSS:

    @media (max-width: 926px) and (orientation: landscape) {
     .responsive-ux #navi-trigger,html .navi-show:not(.ux-mobile) #navi-trigger {
        display: block!important;
     }
     .responsive-ux #navi-header {
        display: none!important;
     }
    .navi-show-center .header-main {
        padding-top: 0;padding-bottom: 0;
    }
    .navi-logo {
        float: left!important;
    }
    .logo-h1 {
        font-size: 24px;
    }
     .responsive-ux .logo-a, .responsive-ux #logo, .responsive-ux .logo-h1, .responsive-ux .header-main,body.responsive-ux #header-main > .container-fluid,.responsive-ux #header #logo .logo-h1,.responsive-ux .navi-logo .logo-wrap,.responsive-ux #header {
        height: 60px;
        line-height: 60px;
     } 
    }

    Your CSS codes lost a } : https://www.dropbox.com/s/ew149twl60xgzsj/qq20210112-101850.jpg?dl=0

    Regards

    #23566
    Anteronilo
    Participant
    Purchased
    Expired

    Thank you that helped alot.

    I have been asked to investigate around one thing more.

    When enter the site from a mobile and visit a page
    e.g. this one…https://anteronilo.se/voulez-vous/

    it is very easy to see that the scrollable image is always shown with its TOP LEFT position
    So – Of below code – the TOP part works – but not the CENTER

    the image should always show the BOTTOM CENTER of the IMAGE SCROLL (Meaning showing the bottom of the image – with a center position)
    i am not talking about the whole page – but the image only…

    @media screen and (orientation: portrait) {
    .touchevents .postid-198 .post-cover .ux-background-img {
    background-image: url(background-image: url(“http://anteronilo.se/wp-content/uploads/2020/12/RelaxLiggande.jpg”)!important;
    background-position: top center;
    background-size: 100%;
    width: 250%;
    height: 180vw;
    touch-action: pan-x pan-y;
    }
    .touchevents .postid-198 .post-cover { overflow-x: scroll;
    overflow-y: scroll; }
    }

    Any ideas…??

    #23568
    Anteronilo
    Participant
    Purchased
    Expired

    PS to the above question.
    If using an phone 12 (X) in a landscape mode – The whole image is not visible (nor i get scroll it to the bottom of the image…)
    Any ideas….

    #23575
    SeaTheme
    Keymaster
    Purchased
    Expired

    Hi,

    Do you mean to make the image center on the screen?
    It is not possible to make it by background-position, the background image is centered in the wrap, but the wrap is not 100% width of the screen, it is 150% width of screen.

    I either don’t know how to make it center.

    The height is set 200% for landscape mode, so it is out of screen including iPhone 12. It has to scroll.

    Regards

Viewing 5 posts - 1 through 5 (of 5 total)
  • You must be logged in to reply to this topic.

Join Newsletter(FREE)

Subscribe to our newsletter to receive news & updates. We promise to not spam you, super promise!