How To Remove Spacing Between Images In Product Description(In Custom Liquid Section)

[ERCC]

Hi, 

I add a custom liquid section in product page for displaying the product description below the Product information section.However, there are white spaces or margins between image in description(rich text).

My product page url: Product page preview 

Using Dawn 12.0.0 theme and the custom liquid code below:

<div class="page-width">
<div class="rte">
<h2>Product Detail</h2>
{{product.description}}
</div>
</div>

How can I remove the spaces or margins ?

I have searched and tried some method in other topic in community,but it did not work.

Thanks 🙏

[PageFly-Henry]

Hi @ERCC 

This is Henry from PageFly - Landing Page Builder App

You can try this code by following these steps: 

Step 1: Go to Online Store->Theme->Edit code.

Step 2: Search file base.css

Step 3: Paste the below code at bottom of the file -> Save

@media (max-width: 767px){

.t4s-product__description.t4s-rte p:last-child {

    line-height: 0 !important;

}

.t4s-product__description.t4s-rte p:last-child img {

    margin-bottom: 0 !important;

    border: 0 !important;

}}

Hope that my solution works for you.

Best regards,

Henry | PageFly

[ERCC]

Thank you for the help

[PageFly-Henry]

You are welcome 😊 @ERCC 

[Dan-From-Ryviu · Accepted solution]

Please update your code to this 

<div class="page-width">
<style>
.rte img {
    margin-bottom: 0 !important;
    display: flex;
    flex-direction: column;
    box-shadow: unset !important;
    border: unset !important;
}
</style>
<div class="rte">
<h2>Product Detail</h2>
{{product.description}}
</div>
</div>

[ERCC]

It work!

Thanks again❤️