How do I center an embedded form?

To center your embedded form on your webpage, start by copying either your form’s Iframe or Seamless embed code from the Publish page in your builder.

  • Iframe: Underneath the embed code, add a short script block that allows you to pass through your own CSS. This CSS snippet will center your form on your webpage:
<script>
Cognito.setCss('.c-forms-form { margin: 0 auto; }'); 
</script>
  • Seamless: Paste your embed code into your website’s HTML. Then, insert the following code into your style sheet, or within a style block on the page. This CSS snippet will center your form on your webpage:

.cognito .c-forms-form{margin:0 auto;}

Learn more about customizing your form’s CSS in our Advanced CSS Guide.