Removing header logo image in mobile devices creates white space

I used this css to remove the header image logo for mobile devices:

@media (max-width:767px){

.x-brand{
display:none;
}
}

The header image logo is gone but it shows a white space where the image header should have been. How do I remove the logo image header for mobile devices and the white space it creates?

Hi @Bark201

That’s the code needed in your case:

@media (max-width:767px){
    header.masthead{
        display:none;
    }
}

I’ll list below some CSS/HTML resources that should help you to carry on these modifications on your own in the future:

Thanks.

Thank you for your reply, that fixed it. I do have one more small question please. I wish to replace the current footer I have (look at the home page to see the footer I mean with the images and links) with a new one from a plugin. How do I hide that footer on all pages/posts so that it will be disabled (not hidden if possible) in desktops only?

Hello @Bark201,

Thanks for asking. :slight_smile:

What you are looking for in footer will require custom development and it falls outside the scope of support we can offer. However, you can use following code under X > Theme Options > CSS to hide footer on desktop:

@media only screen and (min-width: 900px) {
    .x-colophon.bottom .x-colophon-content {
    display: none;
}
}

To learn more about media queries, please take a look at following resource.

https://www.w3schools.com/css/css_rwd_mediaqueries.asp

Thanks.

Thank you for your reply. If I have any issues with the footer I will let you know.

One more thing please, I discovered a bug in the theme, it must be new because I didnt see it before. The issue is when the mouse is hovered over an image a text is displayed. There are certain images I do not wish to have a title displayed when hovered.

I will post a url so you can see what I mean. If you can fix it in your next update that would be great. In the meantime can you please provide the the CSS to disable text that shows on images when they are hovered?

I fixed it so no need to reply.

Glad to hear you got it sorted.

Cheers!

Thank you Jade.

There is a minor issue I noticed I would like to address. The custom 404 plugin from theme x is marked as ‘soft 404’ by google. Only that page. How do I fix it?

Hi @Bark201,

Please edit this file \wp-content\plugins\tco-custom-404\views\site\custom-404.php and replace this line

$wp_query->is_404 = false;

with

$wp_query->is_404 = true;

This was set to false to other existing issues, but you can set it to true.

Thanks!

This topic was automatically closed 10 days after the last reply. New replies are no longer allowed.