Jump to content

Centring Highlighted Text Is Not Working

Recommended Posts

Hi, I'm trying to highlight particular text lines with this code, below. It all works great apart from when I've added the code my text lines go left-justified rather than centered despite "text edit" showing center.

 

Any tips?

 

--

// Highlighted Text //

h2 {
  background-image: linear-gradient(to top, #fcd5ce 50%, transparent 50%);
  width: auto;
  display: inline;
  }
h3 {
  background-image: linear-gradient(to top, #ffe5d6 50%, transparent 50%);
  width: auto;
  display: inline;
  }
h4 {
  background-image: linear-gradient(to top, #f8edeb 50%, transparent 50%);
  width: auto;
  display: inline;\h2 {
  background-image: linear-gradient(to top, #fcd5ce 50%, transparent 50%);
  width: auto;
  display: inline;
  }
  }

 
Link to comment
  • Replies 4
  • Views 648
  • Created
  • Last Reply

Top Posters In This Topic

  • 1 year later...
On 9/27/2020 at 6:17 PM, tuanphan said:

Can you share link to page where you use hightlighted text? WE can check easier.

Hey @tuanphan I'm having a similar issue.  In CSS I've coded a Linear Gradient highlight, but when I use it for my list-item-titles and gallery-titles, it's not centered...I'm not sure what parent selector to target to make it work across the site.  Any suggestions?  www.TLAStMarks.com/home

Link to comment
On 2/2/2022 at 10:29 AM, DevonHarris said:

Hey @tuanphan I'm having a similar issue.  In CSS I've coded a Linear Gradient highlight, but when I use it for my list-item-titles and gallery-titles, it's not centered...I'm not sure what parent selector to target to make it work across the site.  Any suggestions?  www.TLAStMarks.com/home

/home page looks fine. Can you take a screenshot of text which you have problem?

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
11 hours ago, tuanphan said:

/home page looks fine. Can you take a screenshot of text which you have problem?

Thanks for taking a look!  For anyone else looking to achieve this, the code I used was 

.list-item-content{
  text-align: center !important;
}

On my h3 tag I have coded 

display: inline !important;

 

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.