Centre Align Custom liquid in Crave Theme

Shopify Discussion
1

I have added a custom liquid section to my footer (in Crave theme), how can I centre the text? Image below.

Jode81_0-1688182134194.png
Jode81_0-1688182134194.png1897Ă—168 6.16 KB

2

@Jode81 , hope you are doing well.

Please try by adding below CSS at the end of your base.css or theme.css file. you have to add your parent div class and use text-align:center property. please check example as below

.parent-clss{
text-align:center;
}
3

Hi Jode81,
You just need to wrap your text with a div and center align this div content with CSS.

 Your Text here

And then open your style.css or theme.css files according to your theme and put this CSS there at the end of the file.

.custom_html{
text-align:center;
}

or you can even apply inline css


Your html here
4

Thankyou for your help, I have entered the code in the base.css file but not that familiar with code. It didn’t work, have I put it in the wrong place?

Jode81_0-1688264573695.png
Jode81_0-1688264573695.png1865Ă—644 37.9 KB

5

Thankyou for your reply, I am not sure exactly where I need to put this code. I have included a screenshot below of where I created the custom liquid file. I added a section in “Customise” not in "edit code’'. Are you able to explain where I add these 2 codes - I am using Crave theme?

Jode81_1-1688265061489.png
Jode81_1-1688265061489.png307Ă—883 20.1 KB

6

Share your store URL and also let me know which text you want to keep it center. So, I’ll provide you the CSS.

7

My store url is: https://www.onestopcelebrations.com/

Below is a screenshot of the text I want to align, you will see it in the footer of my site.

Thank you :slightly_smiling_face:

Jode81_0-1688365419333.png

8

Hey Jode81, You are almost there.
Just need to wrap the text with

 custom text

And add this style at the end of the block labeled as a custom style

.custom_txt{
text-align: center;
}
9

please add the below line of CSS code at the end of your base.css file.

.section-sections--16180273119408__b031a82f-0a99-4d1b-ad21-7eb5f2f4daba-padding{
text-align: center;
}
10

Thankyou so much for your help - this worked!

11

Thankyou - this solution also worked!