Jump to content

Centre text with html

Recommended Posts

Hey I'm hoping someone can help me with this text styling issue I'm having...

I'm trying to center some styled text that text that I've placed on a page with code.

I'm using some CSS to create a highlighted text look (see image). I've added this CSS code in the custom CSS panel: 

.highlight {
  background: linear-gradient(180deg, rgba(255,255,255,0) 65%, #edb6ac 65%);
  display: inline;
}

And I've inserted this code onto the page where I want the highlight text to appear: 

<h4 class="highlight">“When I create my free-flowing abstract artwork, I switch off from the day to day and mindfully immerse myself in my creative practice.”</h4> 

It all looks great, except that I'm trying to center the text and can't get it to work. 

This is on Squarespace 7.1. 

 

Any assistance would be greatly appreciated 🙂

Screen Shot 2020-05-29 at 8.01.36 pm.png

Link to comment
  • Replies 2
  • Views 361
  • Created
  • Last Reply

@bekandco you just need to center the text in parent div. For example you have:

 

<div class="centered-content">
  <h4 class="highlight">“When I create my free-flowing abstract artwork, I switch off from the day to day and mindfully immerse myself in my creative practice.”</h4>
</div>  

And the CSS code:

.centered-content {
text-align : center;
}

This need to do the trick.

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.