Logo Too Small on Sticky Header

Hi,

How do I make my logo the same size on the sticky header? Currently when I enable sticky header, the logo automatically reduces in size when I scroll down.

Thanks!

Regards,
Stella

Hello Stella,

Try adding this CSS code tAppearance > Customize > Additional CSS from dashboard.

    .is-sticky .site-header .custom-logo-link img {
      max-width: 120px;
    }

and do adjustment necessarily.

Regards,
Kharis

Hi Kharis,

Thanks for the CSS code.

Did that and it works for the header but now there’s a big gap between header and content for mobile and tablet versions.

Regards,
Stella

Do you have a link to your site to share here, so I can have a look directly?

Regards,
Kharis

Hi Kharis,

Here’s the link: https://additive3dasia.com

Thanks!

Regards,
Stella

Thank you for sharing.

Try adding this CSS code to Appearance > Customize > Additional CSS from dashboard.

    @media only screen and (max-width: 767px) {
      .elementor-203 .elementor-element.elementor-element-2caf14c {
        padding-top: 0 !important;
      }  
    }

Regards,
Kharis

Hi Kharis,

Unfortunately this CSS code doesn’t work for me either.

Regards,
Stella

Hello Stella,

Try editing your section and set 0 padding for mobile screen size.

25

Regards,
Kharis