Text losing it's formatting

Store Design
, ,

Topic summary

Main issue: Product description spacing initially appears, then disappears on the product page. The merchant used
tags to add paragraph space and seeks a fix (link provided).

Proposed fixes:

  • Enforce spacing via CSS (Cascading Style Sheets): add rules in the theme’s stylesheet to set paragraph margin and line-height under .product__description p (e.g., margin-bottom: 1.5em; line-height: 1.5).
  • Investigate JavaScript (scripts that run after load) possibly overriding styles; check theme.js or related files for code that manipulates description spacing.
  • Clear browser cache or test in an incognito window after changes to verify effects.
  • Alternative quick fix: inject a style block before in theme.liquid targeting .product__description.rte.quick-add-hidden p with a specific line-height (e.g., 23px !important).

Notes:

  • A screenshot was included to illustrate the issue.
  • No confirmation from the original poster that any solution resolved the problem; discussion remains open with suggested next steps.
Summarized with AI on December 16. AI used: gpt-5.
1

Hello

I have written a product description, even added the
in html in order to get space between the paragraphs

When you open the product - it first appears with the line spacing then it disappears?

https://yogaspirit.mu/products/debardeur-lou-blanc-et-doree

Can anyone help

Thanks

2

Hey @TBS2023 ,

If you find that existing styles are removing the spacing, you can add custom CSS to restore it.

Follow these steps:

  1. Go to Online Store > Themes > Edit Code

  2. Find the Assets folder and open the file named theme.scss.liquid or similar (it might have a different name depending on your theme).

  3. Add the following CSS at the bottom of the file:

.product__description p {
    margin-bottom: 1.5em; /* Adjust the value as needed */
    line-height: 1.5; /* Optional: adjust line height for better readability */
}

Test Javascript:

if you suspect JavaScript might be modifying styles after the initial load, check for any scripts that run after the page loads. Look in the theme.js or other relevant JS files for any code that could manipulate styles or remove spacing.

After making any changes, be sure to clear your browser’s cache or check in an incognito window to see if the changes have taken effect.

If I was able to help you, please don’t forget to Like and mark it as the Solution!

Best Regard,

Rajat Sharma

1 Like
3

Hello @TBS2023

You can add code by following these steps

  1. Go to Online Store → Theme → Edit code.

  2. Open your theme.liquid file

  3. Paste the below code before on theme.liquid

.product__description.rte.quick-add-hidden p { line-height: 23px !important; }

Tech_Coding_0-1729497482338.png
Tech_Coding_0-1729497482338.png693×470 25 KB

my reply helpful? Click Like to let me know!
your question answered? Mark it as an Accepted Solution.