Decrease padding of Newsletter block

Site URL: https://www.friendsofrecoveryneo.com/for-support

I'm trying to decrease the bottom padding of a newsletter subscription form (the area of the red box in the image below).  Actually, I'd like to adjust the spacing at the top and between the small text and the email address field, too!  I've tried every solution provided in other posts but nothing has worked.  Can anyone help me out?  Thanks!

Add to Design > Custom CSS

/* newsletter padding */
.newsletter-form-footnote {
    display: none;
}
div#block-yui_3_17_2_1_1641498071156_8910 {
    padding-top: 0px !important;
}

Ah!  Thank you!  That did it!  😀

Thank you @tuanphan! This worked great.

@tuanphan

Hi there, following up on this one as I just tried it without success. I'd love to get the padding at the bottom of this newsletter block to match the top, especially on mobile, if possible. (I did grab the correct block ID) It works to add padding to the top but not the bottom. 

Site url: https://thesucculentstudio.squarespace.com/?password=new

Any advice would be much appreciated!

On 7/13/2024 at 6:42 AM, ellen_b said:

@tuanphan

Hi there, following up on this one as I just tried it without success. I'd love to get the padding at the bottom of this newsletter block to match the top, especially on mobile, if possible. (I did grab the correct block ID) It works to add padding to the top but not the bottom. 

Site url: https://thesucculentstudio.squarespace.com/?password=new

Any advice would be much appreciated!

I see it already fine

Would like to reduce the padding on desktop and mobile for my newsletter block. i.e. space before and after email address box and before the sign up button. See www.pdxjazz.org (towards bottom of homepage)

On 9/17/2024 at 10:02 AM, cassiepdx said:

Would like to reduce the padding on desktop and mobile for my newsletter block. i.e. space before and after email address box and before the sign up button. See www.pdxjazz.org (towards bottom of homepage)

You can use this to  Website Tools > Custom CSS

@media screen and (max-width:767px) {
.newsletter-block .newsletter-form-fields-wrapper {
    margin-top: 0px !important;
}
.newsletter-block .newsletter-form-fields-wrapper>div {
    padding-top: 0px !important;
    padding-bottom: 0px !important;
}
.newsletter-form-button-wrapper.submit-wrapper {
    padding-top: 0px !important;
}
}

On 9/18/2024 at 6:32 AM, tuanphan said:

You can use this to  Website Tools > Custom CSS

@media screen and (max-width:767px) {
.newsletter-block .newsletter-form-fields-wrapper {
    margin-top: 0px !important;
}
.newsletter-block .newsletter-form-fields-wrapper>div {
    padding-top: 0px !important;
    padding-bottom: 0px !important;
}
.newsletter-form-button-wrapper.submit-wrapper {
    padding-top: 0px !important;
}
}

 

Unfortunately adding it to my CSS didn't produce any changes?

On 10/14/2024 at 12:25 AM, cassiepdx said:

Unfortunately adding it to my CSS didn't produce any changes?

That code is for mobile, you can check again