input fields width in contact forms

Home › Forums › Jevelin Theme › input fields width in contact forms

Home › Forums › Jevelin Theme › input fields width in contact forms

Viewing 4 posts - 1 through 4 (of 4 total)
  • Author
    RESOLVED Posts

  • anja_hf
    Participant

    Hi Shufflehound Team,

     

    I’ve been struggling to have contact form 7 fields expanding to the entire available width of a column. They seemed to be stuck, keeping the width defined by the data input size.

    I somehow managed to get the result I wanted, using the following custom  CSS code:

    .wpcf7 div, 
.wpcf7 span, 
.wpcf7 form, 
.wpcf7 p, 
.wpcf7 label
{ width: 100%; }

    The result can be seen here, at the bottom of the page:

    http://www2.anja-foerster.com/de/home-de/

    Without the above CSS code, all form fields shrink to half the width, although the containing column is much wider.

     

    I’m just concerned, that the solution I found is pretty cumbersome and might not be very stable… would there be a better, cleaner way to do it?

    Attachments:
    You must be logged in to view attached files.

    Shufflehound Support
    Moderator

    Solution for this topic

    Hi @anja_hf,

     

    I hope you are well today and thank you for your question.

     

    You can use below CSS solution to achieve the same.

     

    .wpcf7 label {
    display: inline;
}

     

    Best regards,
    Shufflehound team

    anja_hf
    Participant

    Nice one, thanks!

    Much more elegant than my tweak 🙂

    Shufflehound Support
    Moderator

    You are most welcome here 🙂

  • Author
    Posts
Viewing 4 posts - 1 through 4 (of 4 total)