Form Not Displaying Correctly in Webflow

Hi, I’m trying to embed a Feathery form into my Webflow site, but it’s not displaying correctly. Here’s what I’ve done so far:

  • I copied the JavaScript snippet provided by Feathery and pasted it into a “Code Embed” element in Webflow.
  • The form does appear, but the spacing between elements is incorrect—there’s too much space between the form fields and buttons. It looks very different from the Feathery preview.
  • I checked Webflow’s padding and margin settings, and there are seems to be no extra spaces added.

I used to embed Feathery forms into Webflow the same way before, and they worked fine, but this issue suddenly started happening.

Here’s the code I’m using:

    <script src="https://cdn.jsdelivr.net/npm/@feathery/react@latest/umd/index.js"></script>
    <div id='container'></div>
    <script>
    (() => {
        Feathery.init('ed36ae3b-2aa8-4f70-9b68-246c834cbeef')
        const loginEnabled = false;
        Feathery.renderAt('container', { formId: "OpdEqy" }, loginEnabled);
    })();
    </script>

Here’s the link to the website page: Job Application

Thank you in advance.


Hey there, this doesn’t seem to be a feathery issue when it looks correct in the feathery-hosted version. You can check your css on webflow as it seems there’s consistent additional padding (56px by 35px) added on all form elements.