Display Multiple Auth0 Forms Components Side by Side

Align Auth0 Forms components horizontally by assigning meaningful IDs to them and applying the inline-flex display property in custom Cascading Style Sheets (CSS). This configuration allows multiple form components, such as First Name and Last Name, to appear side by side on a single line within an Auth0 form.

• Auth0
• Forms

How are multiple Auth0 Forms components displayed side by side?

1. Assign meaningful IDs to the components (for example, first_name and last_name). This action generates predictable class names for the components (for example, af-componentId-first_name and af-componentId-last_name).
2. Apply display: inline-flex; to these generated classes in the custom CSS configuration.

NOTE: Auth0 does not officially define the method for generating class names. While the provided class names are available as of July 2026, the naming convention may change in future updates.