• Resolved angeadmin

    (@angeadmin)


    Hi
    Please could you help me with a spacing issue I have at the top of my forms – There seems to be a large white space that I can’t get rid of, see this link – scroll down to the refer a friend form bottom right:
    http://dev.cantellotayler.com/temp-jobs/
    It happens on all the forms I have on the site. Is it because that’s where the form title should be? Could you provide me with any coding to adjust the pace or let me know where to add the title if it’s that?

    Thanks

    The page I need help with: [log in to see the link]

Viewing 15 replies - 1 through 15 (of 15 total)
  • Plugin Author Lehel Szilard Marosi

    (@mlehelsz)

    Greetings @angeadmin,

    Is your issue still present on your form? Have you tried to add a margin-top with 0 values for your form?

    Regards,
    Lehel

    Thread Starter angeadmin

    (@angeadmin)

    Hi,
    yes i have put 0 for form margin and padding in contact style dashboard. There is still about a 80px space – see on all forms:

    http://dev.cantellotayler.com/temp-jobs/

    http://dev.cantellotayler.com/submit-a-cv/

    I think it may be where the form title should be but not sure where I add form title? Or code to remove it completely?

    A 🙂

    Thread Starter angeadmin

    (@angeadmin)

    I also have a problem with the radio buttons on this form – that buttons go beneath the work rather than next to it. How can I adjust this?

    http://dev.cantellotayler.com/submit-a-cv/
    A 🙂

    Plugin Author Lehel Szilard Marosi

    (@mlehelsz)

    Hey @angeadmin,

    The distance between your form and the title has nothing to do with the styling of the form. It comes from the bottom margin of the title above the form. I see you are using a page builder, you should define a smaller bottom margin or 0 in your visual builder.

    Example: https://www.screencast.com/t/hcMjMxZoFO5z

    It is the same result for “the submit a cv” page. That distance is part of the block which is above your form. So you need to edit the block above the form, and set a bottom margin to you block.

    Suggestion: As I see you are using divi theme, which has a powerful page builder, so you must have a Design tab for your block, and in that tab search for a spacing settings part as in this image: https://cdn.elegantthemes.com/documentation/wp-content/uploads/2017/05/design-options.jpg

    As for the radio buttons, please use the following instruction to fix your problem:
    Step 1: Go to your custom style and select the radio button panel.
    Step 2: Add a 10px value for your width.
    Step 3: Add a 16px value for the height.
    Step 4: Save your style and check your form.

    Example: https://www.screencast.com/t/BopvUpNdp3L

    If you enjoy our work, please feel free to give us a five star rating or consider donating.

    Regards,
    Lehel

    Thread Starter angeadmin

    (@angeadmin)

    Hi
    I have changed all the margins in the various blocks and the form still doesn’t move up – look now – I’ve added a button to show that it butts up to the text above but the form won’t if I remove the button.
    http://dev.cantellotayler.com/submit-a-cv/

    Also, for the radio buttons – I don’t have an option in my style to change the radio buttons – there is no button in between the submit button and error messages as per your screenshot. I can’t upload a screenshot to show you.

    A 🙂

    Thread Starter angeadmin

    (@angeadmin)

    When I add a new style I can see all the options, when I save that style, the radio buttons and other options disappear from the dashboard.
    A 🙁

    Plugin Author Lehel Szilard Marosi

    (@mlehelsz)

    Hey @angeadmin,

    Have you tried updating the Contact Form 7 Style plugin to the latest version? We have modified a bit the part which decides what kind of options are available for you, depending on your form.

    Thread Starter angeadmin

    (@angeadmin)

    Yes, I have updated to to the latest but it’s still not showing the radio button option.
    Also, for the space issue above the form, I have noticed that the space only appears in Google Chrome, so it’s a browser problem. Not sure if anything can be done about this?

    A 🙂

    Plugin Author Lehel Szilard Marosi

    (@mlehelsz)

    Hello @angeadmin,

    We couldn’t reproduce the problem with the radio button not showing. Also tried to load the page both with Firefox and Chrome and it looks the same. I am using the latest version of both browsers, Windows 10 64bits.

    2017-11-09_1332

    Thread Starter angeadmin

    (@angeadmin)

    HI
    can you look at it now – the style was not attributed to the form you were viewing. It is now. I can’t attach a screengrab of the style dashboard, but the radio button option does not show up so I don’t have the option to change the settings. I am using the latest version of the plugin. When I open the the form style up I can see all the options including radio button and check button are there and then they disappear.
    Should I uninstall and reinstall the plugin to see if that makes a difference? I don’t understand why I don’t have the option the edit the radio buttons?

    A 🙂

    Plugin Author Lehel Szilard Marosi

    (@mlehelsz)

    As I can see the only difference between the style used before and now are the radio buttons.

    Maybe the space top of your form appears because of the edit style button, when you are logged in. Have you tried to check the page when you are logged out?

    The current setup as I see:

    2017-11-09_1947

    Plugin Author Lehel Szilard Marosi

    (@mlehelsz)

    Do you have multiple Contact form 7 forms checked for this styling?

    Do you have this preview selector in your custom style settings?

    2017-11-09_1952

    Plugin Author Lehel Szilard Marosi

    (@mlehelsz)

    I think I have found the issue for the radio buttons. Please un-check one of your forms and leave only the form which is on your submit a CV page. Then add the settings that I have suggested before with the width: 10px and height: 16px . When you are done you can add the other form back as well. Please don’t forget to update your setup after un-checking the other form.

    Thread Starter angeadmin

    (@angeadmin)

    Hey there,
    brilliant – that worked on both counts – thanks so much!!!
    Space above form disappears when I logout.
    Radio button options come up when just the form using the radio button is ticked.

    Brilliant, thank you again,

    A 🙂

    Plugin Author Lehel Szilard Marosi

    (@mlehelsz)

    Hey there,

    Glad that it worked, and thank you for the detailed description and the feedback.

Viewing 15 replies - 1 through 15 (of 15 total)
  • The topic ‘Space at top of form’ is closed to new replies.