Textarea too wide

I added a textarea field to my contact form 7 that is wider than the other fields. How do I get the textarea to be the same width as the other fields?

I added a printscreen of how the form looks after adding the textarea field, but I couldn’t leave it on the website this way.

Hello @eutaw,

I have checked the page in question but didn’t see the textarea field:

Did you hide it? In case you will add it again, the issue is because of the following custom CSS:

.wpcf7 input[type=\"text\"], .wpcf7 input[type=\"email\"], .wpcf7 textarea {
    background-color: #fff;
    color: #000;
    width: 680px;
}

Please update that CSS to this:

.wpcf7 textarea {
    background-color: #fff;
    color: #000;

}

Remove the width property. That cause the overflow. This line .wpcf7 input[type=\"text\"], .wpcf7 input[type=\"email\"], is incorrect too. No need for the backslash. This is correct : .wpcf7 input[type="text"], .wpcf7 input[type="email"], if you want to include textfield selector.

Hope this helps.

When I deleted the backslashes, the width of those area expanded. So I left the backslashes and deleted width: 680px; and it works well. Thank you.

Glad we could help.

Cheers!

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