[Support request] have logo pop down lower than header area

[John MacKenzie]

is there a way make the logo pop down into the main content area see my examples of my current site.

thanks

[Elvin]

Hi,

You can try adding this CSS:

.site-logo {
    margin-bottom: -50px;
}

@media(max-width:1024px){
.site-logo {
    width: 130px;
}
}

But I’m not sure how well it would work on tablets because the site’s navigation is taking too much space. I’ve added width:130px on tablet to reduce its size but I’m not sure if it’d be enough.

In fact, the reference actually has the same issue as well.

[John MacKenzie]

ok thanks! yea i see that, hmmm, will see what i can do with the menu.

anyway to make a similar effect for the sticky logo (and make sticky logo size larger?)

thanks
John

[Elvin]

Try this out.

.site-logo, .navigation-branding {
    margin-bottom: -50px;
}

.navigation-branding img{
    width: 160px;
    height: auto;
}

@media(max-width:1024px){
.site-logo {
    width: 130px;
} .navigation-branding img{
    width: 130px;
    height: auto;
}
}

You can adjust the values to your preference.

[Author]

Posts