How to change mobile logo size

Hey, so you’re wanting the height to be 100px always? Can you post a link?

my site is https://www.InstantTagz.com the logo is to small on mobile devices.

You just need to remove this from your custom css box:

.stickyheader #kad-banner #logo a img {
max-height: 40px !important;
}

Hannah

Its not in the custom css box

Hi there, it looks like you need to put that CSS in the media query section of your stylesheet, like so:

@media (max-width: 992px) {
.stickyheader #kad-banner #logo a img {
  max-height: 100px;
}
}

You might want to try using percentages instead of pixel dimensions though so it’s more fluid.

If you’re using a child theme (which is generally recommended) or have a space to put in custom CSS, then you shouldn’t need the !important because it should take precedence over the styles in the theme’s original stylesheet.

For some reason it not over writing the index code

@mwilson1750

Try this, click on the theme options > main settings. Scroll down to the header style. choose the third options for the shrink header. When you do you should see an option for the mobile sticky header, make sure that is set to off. Then reselect the standard header and save your theme options.

Kadence Themes

That worked, but it wont let me use the standard sticky header option and display the logo right. Also I need the logo centered.

I don’t follow? “standard sticky header option and display the logo right”

Do you have a caching plugin? I still see css as if the mobile sticky header is still turned on?

Kadence Themes

It working now. You guys are great. The only problem I have now is that there is a space between the header and the image background I have.

https://www.InstantTagz.com

The space is only on small screens

What browser? Screen ?

Chrome and the space show at about 1013px or lower.

try adding this css:

@media (max-width: 1200px) {
.sf-menu a {
padding: 10px 15px;
}
}

Kadence Themes

That didn’t work.

The problem is here

<div class=”wrap contentclass” role=”document” style=”padding-top: 15px;”>