iPad version navigation bar overlapping logo

Site URL: http://https%3A%5C%5Cwww.adjojewellery.co.uk

Hello,

Is there anyway to change the font size on the iPad version, it's overlapping my logo on the right side and is moves down on the left, see attached. My website hasn't launched yet so would appreciate some help.

Thanks

Hi Shiller, 

Some Squarespace 7.0 templates offer certain mobile-specific tweaks in Site Styles for an extra layer of customization. If your site was built in 7.0, you may want to have a look into this Squarespace help article for more details:

Advanced mobile styles

Also, here's more in on how to check what's the version your site is using:

What's my site's version and template?

@media only screen and (max-width: 1024px) {
  .Header-inner {
      display: grid !important;
  }

  .Header-inner div {
      margin-left: auto;
      margin-right: auto;
  }
}

Try adding this to Design -> Custom CSS

Hi RWP,

I put the code in but it changed the desktop version as well. 

It will change whenever the screen width is 1024 px or below (which is where the logo started overlapping).

Most small laptops are ~1368px, and desktops and big laptops are higher.

It's showing it looks like on your desktop because the squarespace side bar is taking up some of the width.

Click the little arrow in the top left of your page, near the banner, to make it fill the screen, and it should go back to a horizontal layout.

Just checked and you're right. Thank you x