How To Align Collapsible Row Text To The Left

Store Design
, , , , , ,

Topic summary

A Shopify store owner wants to left-align collapsible row text on their product page while keeping it centered by default.

Initial Problem:

  • Collapsible row content appears centered
  • User seeks CSS solution to align text left
  • Using Dawn theme on brain-boost.co.uk

Solutions Provided:
Two support specialists (PageFly-Theodor and Moeed) offered similar approaches:

  • Add custom CSS code to theme.liquid file
  • Insert code snippet above the </body> tag in the theme files
  • Both provided code blocks (content appears garbled in the conversation)

New Issue:
After implementing the suggested code, the collapsible rows aligned left successfully, but an unintended side effect occurred:

  • A ‘text’ element directly below the product title also shifted position
  • User wants this text element to remain centered

Status: The discussion remains open with the user seeking additional guidance to fix the secondary alignment issue while preserving the left-aligned collapsible rows.

Summarized with AI on November 15. AI used: claude-sonnet-4-5-20250929.
1

I’d like to align the collapsible row test to the left (rather than being central).

Any advice is really appreciated.

URL: https://www.brain-boost.co.uk/products/chocolate-powder

Theme: Dawn

BraxtonEcom_0-1698140587769.png
BraxtonEcom_0-1698140587769.png400×211 32.8 KB

2

Hi @BraxtonEcom
This is Theodore from PageFly - Shopify Page Builder App.
For solving the problem about the How To Align Collapsible Row Text To The Left, let’s try this solution:

Online Store ->Theme ->Edit code->theme.liquid

PageFlyTheodor_0-1698141003652.png
PageFlyTheodor_0-1698141003652.png380×788 43 KB

I’ll be so happy if my suggestion can help to solve your problem. If you have any further questions, please feel free to tell me.
Best regards,
Theodore | PageFly

3

Hey @BraxtonEcom

Follow these Steps:

  1. Go to Online Store

  2. Edit Code

  3. Find theme.liquid file

  4. Add the following code in the bottom of the file above tag

RESULT:

Moeed_0-1698143160906.png
Moeed_0-1698143160906.png378×662 33.1 KB

If I managed to help you then, don’t forget to Like it and Mark it as Solution!

Best Regards,
Moeed

4

Thank you very much, this has made the collapsible row left aligned, however it’s now changed the position of the ‘text’ element directly below my product title. I’d like it to stay central.

Any advice is really appreciated.

BraxtonEcom_0-1698145296002.png
BraxtonEcom_0-1698145296002.png3060×1494 407 KB

5

Thank you very much, this has made the collapsible row left aligned, however it’s now changed the position of the ‘text’ element directly below my product title. I’d like it to stay central.

Any advice is really appreciated.

BraxtonEcom_1-1698145346877.png
BraxtonEcom_1-1698145346877.png501×245 69 KB