Adjust size of Contact Form

Gesine_Liebold · October 2017

Hi there,

I'd like my contact form to have the size 2/3 as it is on your demo site. On my site it looks like this - fills only 1/3 of the width instead of 2/3 and the settings window only gives me the option of choosing a contact form itself - but not of any other options...

Bryan · October 2017

Hi,
Sorry but the link to your website does not work, please check it.
thanks

Gesine_Liebold · October 2017

Hi,

sorry, here again the link: http://neu.gymnasium-meine.de/kontakt/

Bryan · October 2017

Try to use this custom css

.wpb_wrapper .wpcf7-form {
	width: 100%;
}

Gesine_Liebold · October 2017

Thanks! That helped.

Gesine_Liebold · October 2017

Another question: How can I manage the first three fields of the contact form to be in the same row - just the same as it is on your demo page?

Bryan · October 2017

You need to use HTML columns.
<div class="column one-third">CONTENT</div>
Just change the class, one, one-second, one-third, one-fourth

Gesine_Liebold · October 2017

Thanks for the html code! Where do I need to insert it?! The code as you wrote it needs to be extended by the field names which are supposed to fill the columns, right?!

Bryan · October 2017

Just edit the form and place the fields into the divs.
So if you want to have two 1/2 fields in one line, you need to do this
<div class="column one-second">FIRST FIELD</div>
<div class="column one-second">SECOND FIELD</div>
If you still have problems with this, please send us what you already managed to do, we will fix it.

Adjust size of Contact Form

Comments