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
  • Views 1.1k
  • Created
  • Last Reply
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

Contact Customer Care - Learn CSS - Buy me a coffee (thank you!)

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

Contact Customer Care - Learn CSS - Buy me a coffee (thank you!)

Link to comment

Archived

This topic is now archived and is 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.