Jump to content

How can I adjust the responsive CSS of my mobile site?

Recommended Posts

Hi --

I'm hoping to adjust how the mobile stylesheet renders the H1 tag. I've chosen a large, bold title for the front page, yet when it is viewed on mobile, the stylesheet is causing the words to break unnaturally. I'd love for the text to resize to an appropriate scale, similar to how the Bedford template works.

Any advice? Thanks!Jon

Link to comment
  • Replies 3
  • Views 16.8k
  • Created
  • Last Reply

Hey Jon, Try using media queries in the custom css section. To do this in your case:

  1. Go to preview
  2. enter Style mode (alt text)
  3. click the custom css button
  4. add the line of code below

    @media only screen and (max-width: 640px) { h1 {font-size:1.8em;} }

You may need to adjust the "1.8em" larger or smaller based on your preferences.

Link to comment
  • 4 years later...


This topic is now archived and is closed to further replies.

This topic is now closed to further replies.
  • 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.