Jump to content

Making subheader smaller on mobile + aligning site name with menu bar?

Recommended Posts

Site URL: https://www.charlestheori.com


Two questions regarding text in the header of my site (charlestheori.com for reference).


1. I added a subheader to my site using the below code:

a#site-title:after {
    content: "nyc-based copywriter with no interest in writing a screenplay";
    display: block;
    font-size: 16px;
    color: black;
    font-family: franklin-gothic-urw;

It looks great on desktop, but on mobile it runs into the hamburger icon (see screenshot). 

Is there a way to the text smaller/wrap before it reaches the hamburger icon just on mobile?

2. I suppose since I added in the custom CSS to my header, the site name is now sits higher than the menu bar (see attached pic with red line for reference). Is there a way to make it the same x-position as the menu bar?



Site Name_Height_Desktop.png


Link to comment
  • Replies 1
  • Created
  • Last Reply

Top Posters In This Topic

Popular Days

Top Posters In This Topic

Posted Images

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.