Jump to content

Issue with Newsletter Form CSS

Recommended Posts

Site URL: http://www.naturalspoonfuls.com.au

Hey there, 

I have an issue I hope someone can help with. 

www.naturalspoonfuls.com.au

website password is: peanutbutter 

 

I have custom CSS for my homepage newsletter sign up, for a scrolling image, which I am really happy with. I will list css below. This works great. 

However, once the form is completed, the image is squished (see screenshot), is there a way to prevent the form from reducing in size, or to fix this?2024160566_ScreenShot2020-10-30at9_57_41am.thumb.png.79028b6b0e19317fe0ee6897dd4cbd6d.png

Thank you!!

 

 

Quote

Design>Custom CSS 
 

[data-section-id="5f7bad423510c16a7061eac8"]:not( .full-bleed-section ) > .content-wrapper {

 

  margin-left: 16px;

  padding-bottom: 0 !important;

  padding-left: 0;

  padding-top: 0 !important;

  

  }

 

#page-section-5f7bad423510c16a7061eac8 .sqs-col-6:last-of-type {

 

  background-color: #93CCAE;

 

  }

 

Link to comment
  • Replies 8
  • Views 764
  • Created
  • Last Reply

Hi staaaceeey

Kindly use this snippet as hot fix, please ignore the last submission tet@gmail.com

[data-section-id="5f7bad423510c16a7061eac8"] .form-submission-text {
    position: relative;
    top: 200px;
}
[data-section-id="5f7bad423510c16a7061eac8"] .newsletter-form {
   min-height: 550px;
}

 

image.png

image.png

BeyondSpace - Squarespace Website Developer

🖼️ Lightbox Studio (Enable Pinch/Zoom on lightbox)
🗓️ Delivery Date Picker (Squarespace Date picker form field)
💫 Gallery block 7.1 workaround
🥳 Sparkplugin Customisations Browsers (Browse +100 Spark plugin customisations)
🥳 Elfsight Template Browsers (Browse +1000 Elfsight widget Templates)

If you find my answer useful, let's leave a like or upvote so others with the same issue can find their solution. Thank you!

 

Link to comment
1 minute ago, staaaceeey said:

Hi @bangank36

I tried it and unfortunately did not work! 😞 

have you placed the snippet to custom css section? I dont see it in your page

BeyondSpace - Squarespace Website Developer

🖼️ Lightbox Studio (Enable Pinch/Zoom on lightbox)
🗓️ Delivery Date Picker (Squarespace Date picker form field)
💫 Gallery block 7.1 workaround
🥳 Sparkplugin Customisations Browsers (Browse +100 Spark plugin customisations)
🥳 Elfsight Template Browsers (Browse +1000 Elfsight widget Templates)

If you find my answer useful, let's leave a like or upvote so others with the same issue can find their solution. Thank you!

 

Link to comment
1 minute ago, staaaceeey said:

@bangank36

I removed it, but now I have put it back. Please see 🙂

with the custom css added to the site.css file, I can see the form not resized anymore

image.thumb.png.10199b27000de37e89f4b1e6d41934fa.png

BeyondSpace - Squarespace Website Developer

🖼️ Lightbox Studio (Enable Pinch/Zoom on lightbox)
🗓️ Delivery Date Picker (Squarespace Date picker form field)
💫 Gallery block 7.1 workaround
🥳 Sparkplugin Customisations Browsers (Browse +100 Spark plugin customisations)
🥳 Elfsight Template Browsers (Browse +1000 Elfsight widget Templates)

If you find my answer useful, let's leave a like or upvote so others with the same issue can find their solution. 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.