How to remove white space under product description (debutify theme)

Technical Q&A
, , ,
1

Hi, could someone please help me with removing this huge white space below my product description?

Store : winetric.dk

Pw : gohmip

Thanks!

Screenshot_20230902_011411_Chrome.jpg
Screenshot_20230902_011411_Chrome.jpg1080Ă—1799 111 KB

1 Like
2

Hi @Isnds

It a space for a description. Try this one to remove it.

  • From your Shopify admin dashboard, click on “Online Store” and then “Themes”.
  • Find the theme that you want to edit and click on “Actions” and then “Edit code”.
  • In the “Assets” folder, click on “base.css, style.css or theme.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:
.section-description.box.section-border.text-center.small--text-center {
    display: none;
}

I hope it help.

Please don’t forget to Like and Mark Solution to the post that helped you. Thanks!

1 Like
3

Hi, the code worked, thank you!

Is it possible to further decrease the margin in the spaces highlighted in the picture below? (It shouldnt be absolute 0, just lesser space between the sections)

Screenshot_20230902_103133_Chrome.jpg
Screenshot_20230902_103133_Chrome.jpg1080Ă—2170 182 KB

Thanks!

1 Like
4

Try this one. Same Instruction.

#section-template--19582422188362__main > div.product-single > div {
    padding-bottom: 0px;
}
.product-single-reviews-wrapper {
    margin: 0px !important;
}
#section-template--19582422188362__2e4e9378-e416-48d2-a4e5-144bfaffe8c4 > div {
    padding-bottom: 0px;
}

.section-header {
    padding-bottom: 0px !important;
}

.grid__item.large--six-twelfths.medium--six-twelfths.featured-row-right {
    margin-bottom: 0px !important;
}

And Save.

i hope it help.

Please don’t forget to Like and Mark Solution to the post that helped you. Thanks!

1 Like
5

hey, i really appreciate your help! ive made some changes to the site, would you be willing to help me again :sweat_smile:

Screenshot (31).png
Screenshot (31).png288Ă—845 180 KB

im not sure if it was the previous code that caused this, but i’m looking for a larger margin between the images/gifs and the text header. do let me know if u need me to remove any code added from before. for some reason the second image has a larger space between the text compared to the first.

if possible, i’d like my mobile view (as in the spacing) to be similar to the one used in this website, including the left and right spacing of the body text from the sides of the phone.

hope you could help me once more. thank you!