Skip to content
Public Ticket #18870

Contact form

Conversation thread

PenciDesign Supporter replied

Staff Reply

Hi,

You can modify the code link this:

.wpcf7-form > p:nth-child(2),
.wpcf7-form > p:nth-child(3),
.wpcf7-form > p:nth-child(4) {
    width: 33.3333333333%;
    margin: 0;
    float: left;
    padding: 0 15px;
}
.wpcf7-form > p:nth-child(4) {
    margin-right: 0;
}
.wpcf7-form > p:nth-child(5) {
    clear: both;
}

Regards,
PenciDesign.


buenaoferta replied

Customer Reply

Hi!

The three fields are ordered backwards. If I delete the code you have sent me, the order is fine, but if I add the code the order is reversed. How can it be fixed?
The order is:

1. Tu nombre

2. Tu correo electrónico

3. Asunto

URL: https://xn--laancianadelacabaadelacantilado-27c.com/boveda/escribeme/

What is the code for the form to be responsive on tablet and mobile so that the three fields that are on the same line scroll down. Attached image.

Thanks!

PenciDesign Supporter replied

Staff Reply

Hi,

Please go to Appearance → Customize → Custom CSS then add the following custom CSS code:

.wpcf7-form > p:nth-child(2),
.wpcf7-form > p:nth-child(3),
.wpcf7-form > p:nth-child(4) {
    width: 33.3333333333%;
    margin: 0;
    float: right;
    padding: 0 15px;
}
.wpcf7-form > p:nth-child(4) {
    margin-right: 0;
}
.wpcf7-form > p:nth-child(5) {
    clear: both;
}

Regards,
PenciDesign.



PenciDesign Supporter replied

Staff Reply

Hi,

Please send me the URL containing this form. I'll check and send you a custom CSS code.

Regards,
PenciDesign.


buenaoferta replied

Customer Reply

Hi,

I have installed the plugin and the form does not fit the same as in the image that I have attached before. How can you modify it to make it the same?

I attach a picture of how it looks on me.

Thanks

PenciDesign Supporter replied

Staff Reply

Hi,

This form was built with the Contact Form 7 plugin, you can install this plugin and insert the form shortcode your page.

For more information, please visit the plugin page here: https://wordpress.org/plugins/contact-form-7/

Regards,
PenciDesign.


buenaoferta started the conversation

Conversation Start

Hi!

What do I have to do so that the contact form is the same as in the attached image?

Thanks

Want to join this conversation or access attachments? Sign in first.