Hi Thanks in advance
Can you please help me centre align everything on the About us/Our Story Page (The heading - Our Story & the images)
Let me share a link to the page and an image for reference
https://gomyld.com/pages/about-us
password: hiwawa
A user seeks help centering the heading and images on their About Us/Our Story page.
Proposed Solutions:
Multiple community members provided CSS code snippets to add to the theme’s base.css or theme.css.liquid file:
.main-page-title { text-align: center; } or similar variations targeting the h1 heading element.page-width elements with text-align: centerImplementation Steps:
Several responders included screenshots showing the expected centered result. The discussion remains open with no confirmation from the original poster about which solution worked.
Hi Thanks in advance
Can you please help me centre align everything on the About us/Our Story Page (The heading - Our Story & the images)
Let me share a link to the page and an image for reference
https://gomyld.com/pages/about-us
password: hiwawa
@hitesh469 add below css into base.css file
.main-page-title {
margin-bottom: 4rem;
text-align: -webkit-center;
}
Hey
if you want to make it center aligned specifically for a particular page then you need to add a additional class in the template and style it accordingly.
And in case if you want to center align all the pages then simply add the below CSS:
.page-width h1.main-page-title{
text-align:center;
}
.page-width .rte p{
text-align:center;
}
Hi @hitesh469 ,
I understand that you want to centre align everything on the About us/Our Story Page (The heading - Our Story & the images) .
Try this.
h1.main-page-title.page-title.h0 {
text-align: center;
}
Result:
The Image is already align center.
I hope it help.
And if you want to center also the paragraph. You can use this code.
.page-width.page-width--narrow.section-template--18804121108767__main-padding p {
text-align: center;
}
Result:
I hope it help.
Hi @hitesh469
I hope you are doing good and welcome to the Shopify Community!
I am San from MS Web Designer.
Please add this css in your bottom of the base.css file:
.main-page-title {text-align: center;}
Regards,
San