lianaevans Posted June 29, 2022 Share Posted June 29, 2022 I have done some custom code on the newsletter email box to surround the submit button with the same border as the field itself using absolute positioning. My issue is that if you click the "Book a Demo" button without entering an email, the error message offsets (moves down) the form email field, but doesn't offset the button. As a result I get strange spacing as shown in the screenshot below. Any JS ideas on how to stop the error message from offsetting the field? Because the button has an absolute position and the field does not, I assume that is how it would have to be done, I just don't know which code to invoke to do it. Thanks! Link to comment
tuanphan Posted June 30, 2022 Share Posted June 30, 2022 Hi. Can you share link to your site? We can check problem easier Email me if you have need any help (free, of course.). Answer within 24 hours. Or send to forum message How to: Setup Password & Share url - Insert Custom CSS - Page Header - Upload Custom Font - Upload File - Find Block ID - Contact Customer Care Link to comment
PatrickJ Posted November 9, 2022 Share Posted November 9, 2022 Hey @tuanphan! Having this problem on https://mandarin-vanilla-ss4s.squarespace.com as well, password is "brick" - any help would be appreciated! Link to comment
tuanphan Posted November 12, 2022 Share Posted November 12, 2022 On 11/9/2022 at 3:07 PM, PatrickJ said: Hey @tuanphan! Having this problem on https://mandarin-vanilla-ss4s.squarespace.com as well, password is "brick" - any help would be appreciated! Try adding to Design > Custom CSS /* newsletter error */ @media screen and (min-width:992px) { .newsletter-block .newsletter-form-field-wrapper .field-error { position: absolute; bottom: 40px; } .newsletter-form-footnote { padding-top: 40px; }} Email me if you have need any help (free, of course.). Answer within 24 hours. Or send to forum message How to: Setup Password & Share url - Insert Custom CSS - Page Header - Upload Custom Font - Upload File - Find Block ID - Contact Customer Care Link to comment
PatrickJ Posted November 12, 2022 Share Posted November 12, 2022 13 hours ago, tuanphan said: Try adding to Design > Custom CSS /* newsletter error */ @media screen and (min-width:992px) { .newsletter-block .newsletter-form-field-wrapper .field-error { position: absolute; bottom: 40px; } .newsletter-form-footnote { padding-top: 40px; }} Thanks @tuanphan! That works, but is there any way to maintain the expanding box functionality while having it placed underneath? Cheers! Link to comment
tuanphan Posted November 21, 2022 Share Posted November 21, 2022 On 11/13/2022 at 6:25 AM, PatrickJ said: Thanks @tuanphan! That works, but is there any way to maintain the expanding box functionality while having it placed underneath? Cheers! What do you mean? Can you explain in more detail? Email me if you have need any help (free, of course.). Answer within 24 hours. Or send to forum message How to: Setup Password & Share url - Insert Custom CSS - Page Header - Upload Custom Font - Upload File - Find Block ID - Contact Customer Care Link to comment
Recommended Posts
Create an account or sign in to comment
You need to be a member in order to leave a comment