Title: Adding fields in the same row
Last modified: March 12, 2022

---

# Adding fields in the same row

 *  Resolved [blue](https://wordpress.org/support/users/life2/)
 * (@life2)
 * [4 years, 2 months ago](https://wordpress.org/support/topic/adding-fields-in-the-same-row/)
 * Hi, how to add 5 fields in the same row such that they have the same width (20%
   each)?

Viewing 5 replies - 1 through 5 (of 5 total)

 *  Plugin Author [codepeople](https://wordpress.org/support/users/codepeople/)
 * (@codepeople)
 * [4 years, 2 months ago](https://wordpress.org/support/topic/adding-fields-in-the-same-row/#post-15453446)
 * Hello [@life2](https://wordpress.org/support/users/life2/)
 * You can enter the class name `column5` into the “Add CSS Layout Keywords” attributes
   in the fields values, and then enter the following style definition into the “
   Customize Form Design” attribute in the “Form Settings” tab ([https://resources.developers4web.com/cff/images/documentation/form-settings-tab.png](https://resources.developers4web.com/cff/images/documentation/form-settings-tab.png)):
 *     ```
       #fbuilder .column5{clear:none !important; float:left !important; width: 20% !important;}
       ```
   
 * Best regards.
 *  Thread Starter [blue](https://wordpress.org/support/users/life2/)
 * (@life2)
 * [4 years, 2 months ago](https://wordpress.org/support/topic/adding-fields-in-the-same-row/#post-15453474)
 * Thanks. Another question, what if I wanted to change the width for one of the
   fields (e.g. increase the width for the first field)?
 *  Plugin Author [codepeople](https://wordpress.org/support/users/codepeople/)
 * (@codepeople)
 * [4 years, 2 months ago](https://wordpress.org/support/topic/adding-fields-in-the-same-row/#post-15453481)
 * Hello [@life2](https://wordpress.org/support/users/life2/)
 * You can assign different class names to the fields and define these styles through
   the “Customize Form Design” attribute in the “Form Settings” tab.
 * Best regards.
 *  Thread Starter [blue](https://wordpress.org/support/users/life2/)
 * (@life2)
 * [4 years, 2 months ago](https://wordpress.org/support/topic/adding-fields-in-the-same-row/#post-15454409)
 * Okay, I see, but I have a problem. The fields don’t look good on smaller screens
   with the 5 columns. How do I change the number of columns based on the screen
   size?
 *  Plugin Author [codepeople](https://wordpress.org/support/users/codepeople/)
 * (@codepeople)
 * [4 years, 2 months ago](https://wordpress.org/support/topic/adding-fields-in-the-same-row/#post-15454506)
 * Hello [@life2](https://wordpress.org/support/users/life2/)
 * The solution would be to use the `@media` instruction in CSS ([https://www.w3schools.com/cssref/css3_pr_mediaquery.asp](https://www.w3schools.com/cssref/css3_pr_mediaquery.asp)),
   like:
 *     ```
       @media screen and (min-width:640px)
       {
       #fbuilder .column5{clear:none !important; float:left !important; width: 20% !important;}
       }
       ```
   
 * Best regards.

Viewing 5 replies - 1 through 5 (of 5 total)

The topic ‘Adding fields in the same row’ is closed to new replies.

 * ![](https://ps.w.org/calculated-fields-form/assets/icon-256x256.jpg?rev=1734377)
 * [Calculated Fields Form](https://wordpress.org/plugins/calculated-fields-form/)
 * [Frequently Asked Questions](https://wordpress.org/plugins/calculated-fields-form/#faq)
 * [Support Threads](https://wordpress.org/support/plugin/calculated-fields-form/)
 * [Active Topics](https://wordpress.org/support/plugin/calculated-fields-form/active/)
 * [Unresolved Topics](https://wordpress.org/support/plugin/calculated-fields-form/unresolved/)
 * [Reviews](https://wordpress.org/support/plugin/calculated-fields-form/reviews/)

 * 5 replies
 * 2 participants
 * Last reply from: [codepeople](https://wordpress.org/support/users/codepeople/)
 * Last activity: [4 years, 2 months ago](https://wordpress.org/support/topic/adding-fields-in-the-same-row/#post-15454506)
 * Status: resolved