Center Multicolumn Text Title on Desktop as well as mobile

Shopify Discussion

Topic summary

A user is experiencing an issue where their multicolumn section title centers correctly on mobile devices but not on desktop, despite having CSS applied.

Problem Details:

  • CSS currently centers text on mobile only
  • Desktop view shows misalignment
  • Screenshot provided showing the desktop layout issue

Proposed Solutions:
Two community members suggested similar CSS fixes:

  • Replace the existing text-align: center with additional flexbox properties
  • Add align-items: center and justify-content: center to the .multicolumn__title class
  • These properties should enable proper centering across both desktop and mobile viewports

The discussion remains open pending confirmation from the original poster on whether the suggested solutions resolved the issue.

Summarized with AI on October 31. AI used: claude-sonnet-4-5-20250929.
1

Hello,

My mulicolumn title is centering on mobile with my CSS but not desktop. Any idea why? Thank you. Screenshot attached.

URL: www.samiyaskincare.com.au

Screenshot 2025-02-16 at 16.26.05.png
Screenshot 2025-02-16 at 16.26.05.png3840×990 504 KB

2

Hi @ellacoker
Please replace text-align: center with

text-align: center;
 align-items: center;
 justify-content: center;

Please like and accept solution if it works for you

Thanks!

3

Hi @ellacoker , please use this instead:

.multicolumn__title {
    text-align: center;
    justify-content: center;
    align-items: center;
}