Jump to content

different text styles / sizes in same text box?

Recommended Posts

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

hi there,

 

is it possible to do different text styles in the same text box?

 

i'd love for a top line to be one font and bigger

and the second line to be smaller and a different font. not sure how to achieve this with the dropdown text themse squarespace offers.

 

i want to do this for for the text on all three  image on my homepage at www.betweentwonaps.com

 

 

thanks for any help!

 

ref image example from my site where i'd love to make this work:

image.png.6855b1ace2e8886c216515c2c85113a6.png

Edited by btn2020
Link to comment
  • Replies 11
  • Views 2.5k
  • Created
  • Last Reply

Top Posters In This Topic

  • 2 weeks later...
On 12/23/2020 at 8:41 PM, btn2020 said:

hi @tuanphan sorry, i corrected the link. any help appreciated!

 

 

Add to Home > Design > Custom CSS

div#block-2eee5f09d94ca713087a p {
    font-size: 20px;
}
div#block-2eee5f09d94ca713087a a {
    font-size: 10px;
}

 

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
  • 1 year later...
13 hours ago, Mary_DG said:

Hello Taunphan,

I need to resize the ® on the chef-avenue.com/omnipan page title to about half the size of the current text. But when I change the font size it applies to all. 

Thank you in advance. 

 

Replace Text Block to Markdown Block with this syntax

### Omnipan<span style="font-size:10px;">®</span> Brings Effortless 
Cooking to You

### means heading 3

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
16 hours ago, Mary_DG said:

Hello Taunphan, I tried it but it looks different that what I already have and the ® is at the bottom instead of top right of the last letter:

image.thumb.png.4eecfd88e864c401b7d7412437e787f2.png

Okay. You can remove Markdown. 

Next, make

® italic

then add this to Design > Custom CSS

div#block-2162d5d422d5992836be h3 strong em {
    font-style: normal;
    font-size: 10px;
}

 

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
  • 2 weeks later...
On 8/2/2022 at 12:42 AM, Mary_DG said:

Hello Tuanphan, 

I did what you asked by R is showing at the bottom:

 

image.png.416dab2e9b19fae370d319265d3460f5.png

 

Thanks, 

Try this new code

div#block-2162d5d422d5992836be h3 strong em {
    font-style: normal;
    font-size: 10px;
	position: relative;
	top: -20px;
}

If it still doesn't work, can you share link to page in screenshot? We can check easier

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
  • 6 months later...

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.