Tagged: 

Viewing 8 posts - 1 through 8 (of 8 total)
  • Author
    Posts
  • September 19, 2018 at 9:47 am #1011696
    aussiedropbear

    Hi,

    I had this resolved on another site but I think im doing something wrong with this site?

    Here is the previous support item
    https://kriesi.at/support/topic/prevent-overlap-when-in-mobile-view/?login_error

    I’m wanting to achieve the same for the home page on this site when in mobile view.

    Here is what I have in the Quick CSS

    /*—————————————-
    // CSS – move overlap on home when mobile view
    //————————————–*/
    @media only screen and (max-width: 767px) {
    .home .av-equal-height-column-flextable {
    margin-top: -139px !important;
    }
    }

    @media only screen and (max-width: 480px) {
    #full_slider_1 .avia-slideshow-inner, #full_slider_1 img{
    height: 220px !important;
    }
    }

    September 19, 2018 at 11:56 am #1011749
    Rikard

    Hey John,

    Please try this instead:

    @media only screen and (max-width: 767px) {
.home #av_section_1 .av_one_full {
  margin-top: -139px !important;
}
}

    Best regards,
    Rikard

    September 20, 2018 at 1:12 am #1012076
    aussiedropbear

    Many thanks Rikard that did the trick.

    If I were to have it for the other pages as well would I drop the .home function?

    Thanks
    John

    September 20, 2018 at 4:35 am #1012129
    Mike

    Hi,
    Typically that is what you would do, but please check all of your pages because there is a chance that it could effect some elements you don’t want it to.

    Best regards,
    Mike

    September 26, 2018 at 7:39 am #1014564
    aussiedropbear

    Hi Mike.

    Yes, removing it does affect another page. The contact page.

    The element with the form at the tope of the page now has its heading being chopped off.

    Is there a way to correct this?

    Thanks
    John

    • This reply was modified 6 years, 1 month ago by aussiedropbear. Reason: incorrect information
    September 26, 2018 at 9:35 am #1014608
    Rikard

    Hi John,

    Please try this CSS as well:

    @media only screen and (max-width: 767px) {
.page-id-156 .post-entry-156 {
    padding-top: 100px !important;
}
}

    Best regards,
    Rikard

    September 26, 2018 at 1:09 pm #1014704
    aussiedropbear

    Thanks Rikard, that worked.

    Please close thread.

    Cheers
    John

    September 27, 2018 at 12:17 am #1015027
    Basilis

    Hi,

    Glad we could help!

    Please take a moment to review our theme and show your support https://themeforest.net/downloads
    Don’t forget to bookmark Enfold Documentation for future reference.

    Thank you for using Enfold :)

    Best regards,
    Basilis

  • Author
    Posts
Viewing 8 posts - 1 through 8 (of 8 total)
  • The topic ‘Prevent overlap when in mobile pt2’ is closed to new replies.