Hi! I have a 2 column contactform 7. I need to have it responsive for my mobile view.
the second columns should be under the first one in mobile view (iphone etc). I don't know how to do it... any ideas?
please check:
alpha.peitzner.com/kontakt
Balanean Corneliu answers:
Edit the CSS in your theme to add a style of 100% width for textarea.
textarea {
width: 90%;
}
or
textarea {
width: 100%;
}
depends of your wish.
Balanean Corneliu comments:
Better you can use :
style.css:
div.wpcf7 .wpcf7-form-control { max-width: 100%; }
Balanean Corneliu comments:
Back with full code and description:
1. Open up your theme's style.css file, and
2. Add the following CSS:
@media screen and (max-width: 599px) {
.wpcf7-form-control {
width: 95% !important;
}
.wpcf7-form-control.wpcf7-submit {
font-size: 18px;
font-size: 1.286rem;
padding: 14px 0;
padding: 1rem 0;
}
}
if you whant the submit button to be smaller to can add:
.wpcf7-submit {
width: 50%;
}
klaus dyba comments:
Great! Worked so far! One thing. Please see attachment screenshot of my phone view.
the email box has perfect width and padding, but the others are shorter. Any idea why?