Center Header Logo On Mobile

Center_Logo.png

Description

Easily center the header logo or site title on mobile. This plugin uses code injection and works with Squarespace 7.1.


How To Install

From your Squarespace account, go to the Custom CSS Editor. Copy and paste the code below into the Custom CSS Editor box.

For an upload logo, use Center Header Logo and for site title text use Center Site Title.

// Center Header Logo //

@media only screen and (max-width: 640px) { .header-title-logo {
    width: 120%;
    text-align: center;
}
}

// Center Site Title //

@media only screen and (max-width: 640px) { .header-title-text {
    width: 120% !important;
    text-align: center !important;
}
}

Customize

Depending on the width of your logo or site title, you may need to adjust the width % value to your liking.

You can center the logo or site title on desktop through the header layout settings.


Previous
Previous

Hide Hamburger Menu Icon On Mobile

Next
Next

Animated Gradient Text Logo (7.1 Version)