Archived topic

Site-Logo smaller on mobile?

3 replies · Started by Edin on March 9, 2020

Viewing posts 1–4 of 4

March 9, 2020 at 3:57 am #1189402

I've tried to make the site-logo smaller on mobile because it causes the "burger-menu" to fall into the next line.

I've tried to re-design to be smaller in size, but it seems that the theme stretches it into the same dimension with a lesser resolution.

Then I used this CSS:

@media (max-width: 768px) {
    .site-logo {
        max-width: 200px; /* adjust size */
    }
 }

It worked, but the logo seems clinched (squeezed together), the height isn't adjusted at the same time.

What can I do?

Thanks,
Edin

March 9, 2020 at 5:04 am #1189461

Hi there,

try this CSS instead:

@media (max-width: 768px) {
    .navigation-branding img,
    .site-logo.mobile-header-logo img {
        height: 50px;
    }
}

March 9, 2020 at 5:26 am #1189484

Brilliant!

Thank you, David!

March 9, 2020 at 5:32 am #1189490

You're welcome

This archived topic is closed to new replies.