CF7 spacing issue: padding and margins

  • team-ac-realty

    (@team-ac-realty)


    10 years, 7 months ago

    Hi All
    Having a bit of an issue with spacing on my cf7 forms
    As you can see from the photo below the spacing between: “Location prefered”
    and “Basements” there is a huge gap!
    Photo example here
    Link to issue here

    Im wondering if there is a way that some padding and margin code can fix that in cf7 without doing it in the style.css and just fixing it for this one instance.

    Below I have an example of some of the code used here. The second line where is says: padding top 3px helped it moved closer together already. Just stumped how I can move it a little closer.

    <b>*Location preferred:[text* location]
<padding-top: 3px>
<b>Basement:[select basement "Finished" "Unfinished" "Semi-Finished" "Walk-Out" "Apartment" "None"]
<b>*Bedrooms:[select* bedrooms "1+" "2+" "3+" "4+" "5+"]

    Your help is greatly appreciated Thank you for your time
    Chris

    https://wordpress.org/plugins/contact-form-7/

Viewing 1 replies (of 1 total)
  • davmerit

    (@davmerit)

    10 years, 7 months ago

    See Styling Contact Form for a general explanation of styling CF7 forms using CSS.

    There is a link at the bottom of the page to a comprehensive and detailed article on Styling Contact Form 7 Forms. The article shows people, with suitable HTML & CSS skills, how to change the appearance of their Contact Form 7 Forms to meet their particular requirements.

    I have examined your form in firebug. I can see you have used float: left. This is likely to cause problems.

    Also <padding-top: 3px> has probably been used the wrong way. The example below adds a top padding to a <p> in an inline style – hopefully that would help 🙂

    <p style="padding-top : 3px;"></p>

    You could consider using Contact Form 7 Skins to style your Contact Form 7 Forms.

    They offer CF7 Skins Ready as an add-on to CF7 Skins which provides a reliable way to place form fields in multiple vertical column

Viewing 1 replies (of 1 total)

The topic ‘CF7 spacing issue: padding and margins’ is closed to new replies.