Styling a Form in Columns

Get Help
,
1

I’ve got a new web build and the guy is pretty adamant that we keep the same look from his existing site (long story). They are using a crappy contact form and I want to use Gravity Forms…so is there any way to style a form like this where you have the name, phone, and email on the left and a message box on the right?

download
download1307×462 103 KB

2

You can set the Name and Comments fields in the same row. Resize width of Email and Phone to match that of Name. Finally, you can target the Comments input with the following CSS:

body .gform_wrapper .gform_body .gform_fields .gfield#field_7_2  {
    grid-row: span 3;
}

Update the #field_7_2 to match your specific form ID and field ID.

1 Like
3

Thanks for chiming in! So I’m getting closer…

Here is my test: Form Test | DEV - The Law Offices of Colby Lewis (ignore how ugly it is for now).

I have name and comments left and right in the same row. I’ve got email and phone and name set to large. It’s kicking the phone number to the far right now.

4

This topic was automatically closed 30 days after the last reply. New replies are no longer allowed.