Jump to content

Padding above Product title

Recommended Posts

  • Replies 6
  • Views 870
  • Created
  • Last Reply

Hi Tuanphan, 

Password is: jd

Ive managed to fix the initial issue, however I have another one now.... 

May I please get your assistance with some other padding issues...
https://shallot-pumpkin-jwth.squarespace.com/shop/bath-caddy
Ive added a Markdown box in the Additional info section of the product, and have added a Accordian Dropdown box function which is working perfectly, however after the dropdown box there is a big gap in between that and the selectable boxes... Could you please help me identify this section and the code necessary? 

Also wouldnt mind some help in resizing some of the variable data boxes too.. The Qty boxes and the Variation boxes... etc.. 

Thanks!

Screen Shot 2020-08-13 at 8.53.50 pm.png

Link to comment
On 8/13/2020 at 5:58 PM, tommiatke2 said:

Hi Tuanphan, 

Password is: jd

Ive managed to fix the initial issue, however I have another one now.... 

May I please get your assistance with some other padding issues...
https://shallot-pumpkin-jwth.squarespace.com/shop/bath-caddy
Ive added a Markdown box in the Additional info section of the product, and have added a Accordian Dropdown box function which is working perfectly, however after the dropdown box there is a big gap in between that and the selectable boxes... Could you please help me identify this section and the code necessary? 

Also wouldnt mind some help in resizing some of the variable data boxes too.. The Qty boxes and the Variation boxes... etc.. 

Thanks!

Add to Home > Design > Custom CSS

/* space between accordion variants */
.ProductItem-details-excerpt {
    margin-bottom: 0 !important;
}
/* Variant size */
.variant-select-wrapper {
    padding-top: 10px !important;
    padding-bottom: 10px !important;
}
/* Quantity box */
.product-quantity-input input {
    padding-top: 10px !important;
    padding-bottom: 10px !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
2 hours ago, tuanphan said:

Add to Home > Design > Custom CSS


/* space between accordion variants */
.ProductItem-details-excerpt {
    margin-bottom: 0 !important;
}
/* Variant size */
.variant-select-wrapper {
    padding-top: 10px !important;
    padding-bottom: 10px !important;
}
/* Quantity box */
.product-quantity-input input {
    padding-top: 10px !important;
    padding-bottom: 10px !important;
}

 

Hey @tuanphan Thank you SO much for this, worked a treat. 

I wondered if I could push the friendship another step further, and see if you could provide code to have the 'Add to Cart' button float up next to the Quantity button? Just want to decrease the wasted empty space there. 

Thanks! 

Tom 

Link to comment
/* quantity - add to cart */
@media screen and (min-width:768px) {
.ProductItem-details-checkout>div:nth-child(n+4) {
    float: left !important;
}
.ProductItem-details-checkout>div:nth-child(n+5) {
    width: 66%;
    margin-left: 4%;
    margin-top: 10px;
}
}

 

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

Archived

This topic is now archived and is closed to further replies.

×
×
  • 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.