Mobile display issues

Hey hostworks,

1. Please try this in Quick CSS:

@media only screen and (max-width: 1024px) {
#header_main_alternate {
  display: none;
}
}

2. And this as well:

.html_av-overlay-side #top #wrap_all div .av-burger-overlay-scroll #av-burger-menu-ul a:hover {
    background-color: #ddd;
}

Best regards,
Rikard

Hi,

Please try this CSS instead:

@media only screen and (max-width: 1190px) {
#top #header_main_alternate {
  display: none !important;
}
}

Menu text; you have this CSS applying:

#header .avia_hidden_link_text {
    display: block !important;
}

I’m not sure where it’s added though, it might in the WordPress customiser.

Best regards,
Rikard

Hi,

This CSS is still applying on your site, and it’s overriding the CSS I gave you:

#header .avia_hidden_link_text {
    display: block !important;
}

If you need help finding it, then please post admin WordPress login details in private. It doesn’t seems to be coming from the theme, so you might want to check in the WordPress customiser.

Best regards,
Rikard

Hi,

Thanks for that. It’s added under Appearance->Customiser->Additional CSS, please remove it from there.

Best regards,
Rikard

Hi,

The code I referred to in this reply.

Best regards,
Rikard

Hi,

Please remove following code

#header .avia_hidden_link_text {
    display: block !important;
}

and then go to Enfold theme options > Performance and disable CSS file merging and compression, save theme options, flush cache, confirm that text is removed and then enable CSS file merging and compression again :)

Best regards,
Yigit