Viewing 3 posts - 1 through 3 (of 3 total)
  • Author
    Posts
  • June 24, 2016 at 7:50 am #652908
    yingyang

    I am trying to hide a fullwidth easy slider for mobiles, i ve added the custom css code shown in this link to my functions.php http://kriesi.at/documentation/enfold/turn-on-custom-css-field-for-all-alb-elements/

    add_theme_support(‘avia_template_builder_custom_css’);

    I then added thiscode to enfold > general styling > quick CSS as explained here https://kriesi.at/support/topic/how-to-have-colour-section-hide-and-layerslider-display-when-viewed-on-mobiles/

    /*HIDE ON DESKTOP*/
    #mobile {display: none !important;}

    @media only screen and (max-width: 767px) {
    /*HIDE ON MOBILE*/
    #desktop {display: none !important;}
    /*SHOW ON MOBIL*/
    #mobile {display: block !important;}
    }

    and finally added the word MOBILE to the element custom CSS class field at the bottom

    All that done, still doewst work though, what did i miss ?

    June 24, 2016 at 8:02 am #652912
    Jordan

    Hey kilimats,

    If you added the custom class “mobile” to the element then try changing the code to this:

    /*HIDE ON DESKTOP*/
.mobile {display: none !important;}

@media only screen and (max-width: 767px) {
/*HIDE ON MOBILE*/
.desktop {display: none !important;}
/*SHOW ON MOBIL*/
.mobile {display: block !important;}
}

    If that doesn’t work then could you please provide a link and login details to your site, so that we can have a closer look. You can place the information in the Private Content section of your reply.

    Best regards,
    Jordan

    June 24, 2016 at 5:42 pm #653106
    yingyang

    THat did the trick thanks !

  • Author
    Posts
Viewing 3 posts - 1 through 3 (of 3 total)
  • The topic ‘Hiding a avia element for mobile’ is closed to new replies.