[rob]

Hi Sankin

Hope you are well…

I was wondering if you could fix a small issue with my web site that uses Catch Adventurous Pro Theme.

http://www.richmanuk.com

Password rich

The issue is with the logo in mobile responsive view when you scroll down the page the logo jumps below the hamburger menu.

I have implement some css from this forum to increase the size of the logo – however the logo now has the jumping issue as described above.

Thanks Sankin – you are always a great help and your templates are ACE…

[Pratik]

Hi @rob,

If you go to “Appearance=> Theme Options => Custom CSS”, You will see following code added:

#site-logo img, #masthead.fixed-header #site-logo img {
    max-height: 100px;
    padding-top: 15px;
}

#masthead.fixed-header {
    padding-top: 15px;
}

.fixed-header #header-right,
#header-right {
    float: right;
    padding-top: 15px;
}

What this has done is added the padding on all devices. Replace this code with following code:

/* Select only devices with width greater than 960px */
@media screen and (min-width: 960px) {
	#site-logo img, #masthead.fixed-header #site-logo img {
	    max-height: 100px;
	    padding-top: 15px;
	}

	#masthead.fixed-header {
	    padding-top: 15px;
	}

	.fixed-header #header-right,
	#header-right {
	    float: right;
	    padding-top: 15px;
	}
}

This code will apply css to devices with screen size greater than 960px. This should solve your issue.

Let me know how it goes.

[Author]

Posts