Jump to content

Adjust Nav Element Font Size

Go to solution Solved by meganheath,

Recommended Posts

Site URL: https://mattdecker-art.squarespace.com/portfolio/environment

Hi all! First day on Squarespace and I'm unable to find an element to see if it has a unique CSS class (? - been a minute).

This was a premade template to start; at the bottom of the individual portfolio pages there are some nav elements that I'd like to reduce to font size on for mobile, as they overlap.

Side question: are media queries still the most effective way to specify device styles, and do they work on Squarespace?



Edited by narwhal-enthusiast
linked wrong page
Link to comment
  • Replies 2
  • Created
  • Last Reply

Top Posters In This Topic

Popular Days

  • Solution


Yes, media queries work on Squarespace. The pagination element you're wanting to target uses calc to set the font size. Add this code to your site header through Settings > Advanced > Code Injection

@media screen and (min-width: 0) and (max-width: 1567px) and (orientation: portrait){
	[data-collection-type^="portfolio"] .item-pagination-title {
    	font-size: calc((2 - 1) * 1.2vh + .6rem);

Hope that solves it.

Link to comment

Create an account or sign in to comment

You need to be a member in order to leave a comment

  • Create New...

Squarespace Webinars

Free online sessions where you’ll learn the basics and refine your Squarespace skills.

Hire a Designer

Stand out online with the help of an experienced designer or developer.