how to hide extra element on mobile

Hey Vadivel,
Please include more detail, such as which element to hide, so we can take a closer look.

Best regards,
Mike

Hi,
Try this code in the General Styling > Quick CSS field:

#header_main.container_wrap.container_wrap_logo {
display: none !important;
}

Best regards,
Mike

Hi,
Please try adding this code to the Quick CSS section under Enfold > General Styling or to your child theme’s style.css file:

@media only screen and (max-width: 767px) {
#header_meta {
    display: none;
}
.responsive .logo {
    top: 20px;
}
}

Best regards,
Yigit

Hi,

You can try using the code as following

@media only screen and (max-width: 1024px) {
#header_meta {
    display: none;
}
.responsive .logo {
    top: 20px;
}
}

It will be applied on screens smaller than 1024px. You can adjust the value as needed :)

Best regards,
Yigit

Hi,

You are welcome! :)

For your information, you can take a look at Enfold documentation here – http://kriesi.at/documentation/enfold/
And if there are features that you wish Enfold had, you can request them and vote the requested ones here – https://kriesi.at/support/enfold-feature-requests/
For any other questions or issues, feel free to post them here on the forum and we will gladly try to help you :)

Best regards,
Yigit