Jump to content

Help Adjusting Margins/Spacing for Product Item Details

Recommended Posts

Site URL: http://thesprouthouse.net

Hello, I am looking for help adjusting the margins/spacing between each section on the product details pages. I would like for the product title, description, price, options, and add to cart buttons to all be closer together on both desktop and mobile. If anyone can help, I greatly appreciate it! My site password is $prout, and I am in the trial phase. 

I know very little about CSS, but I am learning! 

Link to comment
  • Replies 3
  • Views 459
  • Created
  • Last Reply

Top Posters In This Topic

On 8/13/2022 at 4:16 AM, thesprouthouse said:

Site URL: http://thesprouthouse.net

Hello, I am looking for help adjusting the margins/spacing between each section on the product details pages. I would like for the product title, description, price, options, and add to cart buttons to all be closer together on both desktop and mobile. If anyone can help, I greatly appreciate it! My site password is $prout, and I am in the trial phase. 

I know very little about CSS, but I am learning! 

The site is expired. You can access this link to extend it

 

Email me if you have need any help (free, of course.). Answer within 24 hours. 
Or send to forum message

Contact Customer Care - Learn CSS - Buy me a coffee (thank you!)

Link to comment

Add this to Design > Custom CSS

/* title price */
h1.ProductItem-details-title {
    margin-bottom: 5px !important;
}
/* price size */
.ProductItem-product-price {
    margin-bottom: 0px !important;
}
.product-price {
    margin-bottom: 5px !important;
}
/* Size quantity */
.variant-option {
    margin-bottom: 0px !important;
}
/* quantity button */
.product-quantity-input {
    margin-bottom: 5px !important;
}

 

Email me if you have need any help (free, of course.). Answer within 24 hours. 
Or send to forum message

Contact Customer Care - Learn CSS - Buy me a coffee (thank you!)

Link to comment

Create an account or sign in to comment

You need to be a member in order to leave a comment

×
×
  • Create New...

Squarespace Webinars

Free online sessions where you’ll learn the basics and refine your Squarespace skills.

Hire a Designer

Stand out online with the help of an experienced designer or developer.