Viewing 2 posts - 1 through 2 (of 2 total)
  • Author
    Posts
  • September 22, 2013 at 5:49 pm #164838
    joe88

    Hello. Is there any options to add a class name to elements like no-ipad or no-iphone to prevent those items from displaying on the devices? Right now, it seems like you have to find each element on the pages and add it to the appropriate media query section. Thanks.

    September 23, 2013 at 10:48 am #165087
    Ismael

    Hello joe88!

    You can add a unique selector for each Avia Elements. Edit functions.php, find this code:

    if(isset($avia_config['use_child_theme_functions_only'])) return;

    Below, add this code:

    add_theme_support('avia_template_builder_custom_css');

    Edit any avia elements like Button element then scroll below. Add a unique css selector on “Custom Css Class” field. For example, add “no-ipad”.

    Use media queries to target each classes. You can add something like this on your custom.css or Quick CSS to not display elements with the no-ipad selector

    @media all and (max-width: 1000px) and (min-width: 700px) {
.no-ipad {
display: none !important;
}
}

    Regards,
    Ismael

  • Author
    Posts
Viewing 2 posts - 1 through 2 (of 2 total)
  • The topic ‘Media Query Classes’ is closed to new replies.