Form styling

  • Resolved stevendbrady

    (@stevendbrady)


    5 years, 11 months ago

    I have a couple questions about the styling of my form.

    1 – Your screenshot shows name and email address side by side (two columns). How do we achieve this?

    2 – The same screenshot shows the form labels inside the form fields. How do I do this?

    3 – The URL text fields have a different border style than the regular text fields (top and left are darker). Is this a bug?

    Thanks!

Viewing 3 replies - 1 through 3 (of 3 total)

  • Hi @stevendbrady

    You can set multiple column fields in Contact Form 7 ( This can be done by using a wrapper class. The class you’ll be using for this is: ” dvppl-cf7-col “)

    e.g: 

    <div class="dvppl-cf7-col">

<label> Name 
[shortcode here] </lable>

<label> Email
[shortcode here] </lable>

</div>

    Thanks

    Hi DiviPeople

    Thank you for your great plugin.

    But in this topic, stevenbrady has asked 3 questions.

    Number 2 is not answered.

    When coded like this, the labels are inside, but if the field will filled out, the text must deleted before, and after deleting the content of the field, the fieldname doesen’t appeare again.

    <label>[examplefield “Examplefield”]</label>

    The divi3 contact form has the better user experience in this case.

    Perhaps you work at a solution?

    Thanks

    The answer is you do not use a label. You use a placeholder.

    <label>Name</label>
    [*name your-name placeholder “Name”]

    Then in your styling, set the label color to transparent.

Viewing 3 replies - 1 through 3 (of 3 total)
  • The topic ‘Form styling’ is closed to new replies.