Make A Custom Form Submit Button That Is Clickable

cr: Lionize Agency

Webflow allows you to style the submit button. But when you have a button with multiple divs and interactions, the submit button can become unclickable

The problem is that when the submit button (the official one that submits the form) is a child of any other wrapper-div, it becomes unclickable and users can no longer submit the form.

You can get around this by adding the following custom code:

The ‘btn-wrapper’ is the class you want clicks to pass through or ignore and ‘submit-btn’ is the class you want to be clickable.

‘pointer-events: none’ - makes the wrapper div “clickthrough” or invisible to clicks, but then you also have to add ‘pointer-events: auto’ to any child classes of the class you have made invisible. This makes them visible to click again