Jump to content

7.1 Newsletter Block CSS Help - how to reduce size of email fill form and submit button

Recommended Posts

Site URL: https://www.weareimagocollective.com/

Hi! I have this code in to change the size of the email and sign up buttons, but the space between "sign up with your..." email field/button and disclaimer is like double what I want it to be.
Here is the code I currently have in:

.newsletter-block {padding-top: 0; padding-bottom: 0}
.sqs-block-newsletter .newsletter-form-field-element {
    padding-top: 8px !important;
    padding-bottom: 8px !important;
}

button.newsletter-form-button.sqs-system-button {
    padding-top: 10px !important;
    padding-bottom: 10px !important;
  }

Website: https://www.weareimagocollective.com/

Thanks!

Screen Shot 2022-09-29 at 6.55.53 AM.png

Screen Shot 2022-09-29 at 6.59.37 AM.png

Link to comment

Hopefully this helps, place in Custom CSS:

.newsletter-block .newsletter-form-header-description p {
   margin-bottom:0rem;
}
.newsletter-block .newsletter-form-footnote p {
  margin-top:0rem;
}

Let me know if this has helped!

Please like and upvote if my comments were useful to you. Thanks!

Zygmunt Spray
Squarespace Website Designer
Contact me: https://squarefortytwo.com/ 
🔌Ghost Squarespace Plugins (Referral link)
Buy me a coffee

Link to comment

Try adding this as well:

.newsletter-form-fields-wrapper .form-fields {margin-top:0rem;}
.newsletter-block .newsletter-form-button-wrapper {margin-top:0rem;}
.newsletter-block .newsletter-form-body {padding-bottom:0rem;}

 

Please like and upvote if my comments were useful to you. Thanks!

Zygmunt Spray
Squarespace Website Designer
Contact me: https://squarefortytwo.com/ 
🔌Ghost Squarespace Plugins (Referral link)
Buy me a coffee

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.