Only show extra element on mobile devices

Hey atwalsh12,

Thank you for using Enfold!

Yes, you can do this. Please turn the Extra Elements on and set them up, then hide them from desktop using this code in the Quick CSS section under Enfold > General Styling or to your child theme’s style.css file:

@media only screen and (min-width: 767px) {
   #header_meta.av_extra_header_active {display:none;}
}

If the code does not work for you, please provide a link to your website so that we can take a closer look.

You can adjust the minimum width to suit your preference. You can set it to 990px, or 1024px if you would like to show the extra elements for tablets. For more information on media queries, please see this article: https://css-tricks.com/snippets/css/media-queries-for-standard-devices/

Best regards,
Sarah

You’re very welcome!

For your information, you can take a look at Enfold documentation here – http://kriesi.at/documentation/enfold/

We’d also appreciate it if you can take a moment to review our theme if you haven’t already. https://themeforest.net/downloads

For any other questions or issues, feel free to post them here on the forum and we will gladly try to help you.

Thank you for using Enfold!

Sarah