Jump to content

Adjusting Size of Header in Just One Index Page on Mobile

Recommended Posts

Hey, community.

The size of my H1 header in my opening index page ("Schedule a Call") is perfect on desktop. But, it's much smaller than I want it to be on mobile and the Pacific Template doesn't offer a way to adjust styling specifically for mobile. Someone pointed me here to try and inject the recommended Custom CSS there but that code doesn't appear to work. Does anyone else have any other custom css suggestions I might try out?

Link to comment
  • Replies 8
  • Created
  • Last Reply

Top Posters In This Topic

Just now, tuanphan said:

Can you take screenshot of header?

or you mean

on-call brand advice.?

 

Yep, exactly. The H1 header is applied just to the "on-call brand advice" text there, so that's exactly the code I'm hoping to adjust on mobile (without affecting any of the other H1 headers across the site, if possible).

Link to comment
11 hours ago, brandi_sqspace said:

Yep, exactly. The H1 header is applied just to the "on-call brand advice" text there, so that's exactly the code I'm hoping to adjust on mobile (without affecting any of the other H1 headers across the site, if possible).

add to Design > custom CSS

@media screen and (max-width:640px) {
div#block-yui_3_17_2_1_1579546551515_93026 h1 {
    font-size: 500px;
}
}

 

Email me if you have need any help (free, of course.). Answer within 24 hours. 
Or send to forum message

How to: Setup Password & Share url Insert Custom CSS - Page Header - Upload Custom Font - Upload File - Find Block ID - Contact Customer Care

Link to comment
9 hours ago, tuanphan said:

add to Design > custom CSS


@media screen and (max-width:640px) {
div#block-yui_3_17_2_1_1579546551515_93026 h1 {
    font-size: 500px;
}
}

 

Added and that doesn't seem to change anything for me on my iPhone. 😞 I think you can check the source code and double check that I copied it correctly into the custom CSS. 

Link to comment
22 hours ago, brandi_sqspace said:

Added and that doesn't seem to change anything for me on my iPhone. 😞 I think you can check the source code and double check that I copied it correctly into the custom CSS. 

try this, It will work

@media screen and (max-width:640px) {
div#block-yui_3_17_2_1_1579546551515_93026 h1 {
    font-size: 50px !important;
}
}

 

Email me if you have need any help (free, of course.). Answer within 24 hours. 
Or send to forum message

How to: Setup Password & Share url Insert Custom CSS - Page Header - Upload Custom Font - Upload File - Find Block ID - Contact Customer Care

Link to comment
11 hours ago, brandi_sqspace said:

You are a miracle worker. Thank you SO much for all of your help!

There has like button & upvote....

Other members can use if they know it worked..

Email me if you have need any help (free, of course.). Answer within 24 hours. 
Or send to forum message

How to: Setup Password & Share url Insert Custom CSS - Page Header - Upload Custom Font - Upload File - Find Block ID - Contact Customer Care

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.