Dawn 10.0 Removing Blank Space Between 2 Images in the Product Description

Store Design
1

Hello,

I am using Dawn 10.0 theme. How do I remove the blank space in between 2 images in my product description? I can’t seem to have the images attached to the next one. Thanks!

bonbons_0-1686415296033.png
bonbons_0-1686415296033.png1043×199 4.55 KB

2

Hi @bonbons ,

If you know a bit of coding you can just reduce the margin or the padding.

If not then would you mind to share your URL website with password if its protected?

Thanks!

3

https://bonbonbeautywellness.com/

pw is test0123poi

Thanks!

4

Thank you for the information. But can you point out which side is this? I already check it but I didnt see same image you have.

5

It is for my product pages for the images in the description.

6

Oh sorry, I need to check it in incognito.

Try this.

  1. From your Shopify admin dashboard, click on “Online Store” and then “Themes”.
  2. Find the theme that you want to edit and click on “Actions” and then “Edit code”.
  3. In the “Assets” folder, click on “theme.css, styles.css or base.css” file, depending on which file your theme uses to store its CSS styles. At the bottom of the file, add the following CSS code:
  4. And Save.
.center.rte.grid__item.product__description p {
    margin: 0px;
    line-height: 0px;
}
.rte>*:last-child {
    margin-bottom: 0;
}
7

The images are good now but it messed up the text description on the top of the images.

bonbons_0-1686419956521.png
bonbons_0-1686419956521.png1187×162 13.1 KB

8

Oh sorry, i didnt notice that.

try this.

.center.rte.grid__item.product__description p:nth-child(n+2) {
    margin: 0px;
    line-height: 0px;
}
.center.rte.grid__item.product__description p:nth-child(2) img {
    margin: 0;
}
.center.rte.grid__item.product__description p:nth-child(3) img {
    margin: 0px;
}

Result:

Ribe_Dagandara_0-1686432797566.png
Ribe_Dagandara_0-1686432797566.png1306×507 113 KB

Ribe_Dagandara_1-1686433009801.png
Ribe_Dagandara_1-1686433009801.png1321×560 71.1 KB

I hope it help.

9

Yay it looks good! :smiley: Thanks!!

10

@Made4uo-Ribe I just noticed it squashed the text on my other pages without images in the description :confused:

11

Yes, Its because of the line-height you can take that one out but it leave a bit of white space.

12

Ah I see. Is there a way to add a separate description box where I can just input text?