Jump to content

Text scale to fit container

Recommended Posts

Site URL: https://shop.jonathan-gallagher.com

I'd like some text to fill the entire width, from edge to edge of it's container without needing to input a specific font-size, as this container is responsive.

As you can see below, the text box is 20% of the width of the block it's in. the other 80% being a carousel with 4 images, so essentially creating 5 squares of equal size. I hope the 5th one can be filled with a couple of words of text.

The 80-20% ratio and number of carousel images, will modify with media-queries to suit different devices

 

#join-in .sqs-col-9 {
    width: 80%;
}

#join-in .sqs-col-3 {
    width: 20%;
}


#join-in .sqs-col-3 h1{
    max-width: 100%;
      min-width: 100%;

font css here?
}

Screenshot 2021-10-30 155230.png

Link to comment
  • Replies 1
  • Created
  • Last Reply

Top Posters In This Topic

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.