Viewing 4 posts - 1 through 4 (of 4 total)
  • Author
    Posts
  • April 24, 2021 at 9:07 pm #1296550
    Anneloes1981

    Hi Guys,

    Im working on the finsihing touch of my website, but cant get around this problem:

    In portrait modus on a tablet, the logo inside the header changes position and size and doesnt look neat at all. No problemo when the site is in landscape modus, than its perefect!!
    Also: when looking to the website on the ipad, the background images look blurry, probably because it zoomed in too much. This doesnt happen when you decrease your browser, than the website stays very nice. How to avoid this and make sure the background picture stays fixed?

    Website details in private content.
    Hope to hear from you, thanks a lot!

    April 27, 2021 at 11:00 am #1296945
    Rikard

    Hi Anneloes1981,

    Please try the following in Quick CSS under Enfold->General Styling:

    @media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation : portrait) {
.responsive .logo {
    margin-top: 0 !important;
    top: 0 !important;
}
}

    Best regards,
    Rikard

    • This reply was modified 3 years, 8 months ago by Rikard.
    April 27, 2021 at 10:14 pm #1297081
    Anneloes1981

    Hi Rikard,

    thanks for your reply!
    Unfortunately, with your suggestion nothing happened. Backgroundpicture is still zoomed in too much and in portrait setting the logo disappears and the header is white/not transparent.
    Any other idea?
    Thank you!

    May 1, 2021 at 4:42 am #1297656
    Rikard

    Hi,

    Thanks for the update. First off all, could you try updating the theme to the latest version (4.8.2) to see if that helps please? https://kriesi.at/documentation/enfold/how-to-install-enfold-theme/#theme-update.

    If you want a sticky header on mobile/tablets, then please refer to this: https://kriesi.at/documentation/enfold/header/#sticky-header-on-mobile

    If you want greater control over how your background images look on smaller screens, then you can duplicate the element in question, and use an image which is better adapted to smaller screens in the new element. You can then show/hide the correct section in the Advanced tab, in the element options.

    Best regards,
    Rikard

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