Hello,
I would like to make my rich text centred on mobile and keep left on desktop. How do I do this?
URL: www.samiyaskincare.com.au
Password: ellacoker
Topic summary
A Shopify store owner needed help centering rich text on mobile devices while keeping it left-aligned on desktop.
A solution was provided using CSS media queries targeting screens under 640px width, applying text-align: center to the .rich-text__blocks.left class. This successfully resolved the initial issue.
The discussion remains ongoing with two new problems identified:
- Uneven padding on either side of content on mobile
- White padding appearing to the left of the home page image
Screenshots were shared showing both the original alignment issue and the new padding problems. The conversation is awaiting further troubleshooting assistance for these secondary layout concerns.
You can add below css to your theme css file to set rich text centred on mobile
@media (max-width: 640px) {
.rich-text__blocks.left {
text-align: center;
}
}
