Link to Home Page on Logo Header

I originally placed my logo image in the Header Image area. Then I realized that image could not be hyperlinked. So I changed it to be the “Header Logo” after I found this thread: https://colorlibsupport.com/t/how-to-make-header-image-link-to-home-page/

Now my problem is that my logo looks just fantastic on desktop, but way too small on the mobile version.

This wasn’t the case when I merely had the logo uploaded as the “Header Image.” The only reason why I changed it is because I wanted users to be able to click on the logo to return to the homepage and this is not possible with the Header Image.

Can someone please explain why the logo does not fill the entire width of the page in a mobile browser? I’ve included screenshots of the desktop home page as well as view of the mobile homepage and a random blog post.

Hi there

Hope you are having a good day and thank you for your question :slight_smile: In order to check your question i need to see your live website, please provide url and i will take a look

So sorry about that! it’s www.seizetheglobe.com

Hello there,

This CSS should help:


@media only screen and (max-width: 767px)
#site-title a img {
    max-width: 100%;
}

@media only screen and (max-width: 1078px)
#site-logo {
    margin-left: 0px;
}

Best Regards,
Support

Do you recommend this only under the mobile or tablet section in the CSS? Sorry, I’m not the most coding literate.

hi there

The last question is a little bit unclear, CSS provided is created for both, it must be added in appearance > customize > additional css