help center

Search
Close this search box.
On this page

Create forms with multiple fields in a row

Last Update: April 18, 2024

By default, every field in a form has its own row. However, in many cases you may want to create more compact, neater looking forms. In the example below, we’ll create a form that will collect visitor’s first and last names in separate fields but on the same row. 

  1. Create a form. For more details, see Form Widget.
  2. Delete all fields except the Name field.
    image 95 Create forms with multiple fields in a row 1
  3. Click the Name field to open it.
  4. Change the Label to First Name.
    image 96 Create forms with multiple fields in a row 3
  5. Change the Column Width to 50%.
    image 97 Create forms with multiple fields in a row 5
  6. In the panel, click the copy OQDI8Lo7NyfaVBZRF1COXpSUu7SHbL9BEAVbDpTQJoZkrsW1s62WGSsCthAP7e1lp0V qBJC3i5kz 1iH oaFXsPYfEhAVjTbhhVClQoddG Iv6AGM9uVxrNGeB6qv6 9m871BVJqfH1W JvICB2g Create forms with multiple fields in a row 7 icon to duplicate the name field. 
    image 98 Create forms with multiple fields in a row 9
  7. Click the new field to open it.
  8. Change the Label to Last Name.
    image 99 Create forms with multiple fields in a row 11

The Column Width will already be at 50% since it is a copy of the First name field. The form now has two fields – First Name and Last Name – on one row.

Have more questions? We’re more than happy to assist.

Link is copied to clipboard!
On this page

Is this article helpful?

Share this article

Stuck?
Our Elementor Expert is Ready

Book a 45-min video consultation call with an Elementor expert and elevate your site!