Can we have a clean theme on the new Form Designer?

  • webflunky
    Asked on November 30, 2014 at 3:22 PM

    Reducing top margin in the form

    I'm trying to reduce the margin at the top of this form and I've tried .form-all and any number of things that I've found when inspecting the page. I've added !important and tried so many combinations to get this white space whittled down. I've even updated my form in the design area, but I can't get rid of it. Here is a link to a sample form: http://www.attainhousing.org/giving-tuesday-donations/

  • webflunky
    Replied on November 30, 2014 at 5:13 PM

    I just want to add something else, that I have already used a negative margin, and I could increase that, except that the form has a white background, so it covers up the image at the top if I get too close. I have already tried setting the background to transparent in the for styles, in the design area, and in extra CSS, but it is always a white background, never transparent. 

    I have a spacer in the top of the column on the right to bring it down to the same level as the form, which has a -38px margin-top.

  • val
    Replied on November 30, 2014 at 9:03 PM

    Hi,

    Please find the CSS code below to your CSS files and change the "margin-bottom:35px;" to "margin-bottom:0px;"

     

    .wpb_row, .wpb_content_element, ul.wpb_thumbnails-fluid > li, .last_toggle_el_margin, .wpb_button {
        margin-bottom: 0px;
    }
     
    Hope this help!
     
    Thanks.

     

  • webflunky
    Replied on December 1, 2014 at 12:34 PM

    Thank you very much, that did work; however, it changed everything site-wide, which I didn't want, so I just added it to the CSS for that particular page. Just saying that in case anyone else is looking at this thread. I appreciate the help.

  • Jan
    Replied on December 1, 2014 at 12:42 PM

    Hi,

    We're glad to hear that your issue is fixed now. In behalf of my colleague Val, you're welcome. Please let us know if you need further assistance. We are here to help.

    Thank you for choosing JotForm!

  • PodiumMC
    Replied on December 2, 2014 at 12:03 PM

    Here's a question - why does the default top margin have to be so much? Why can't it be set to a default of 0, or 10? And then if someone wants more, they can add more?

    Here is what I had to adjust

    In order to have my form look somewhat reasonable, I've had to adjust the padding to this:

    *****

    .form-all {

        margin-top : -100px;

        margin-left : -10px;

    *****

     

    Why do I have to use such drastic margin adjustments? 

    I see another site that uses JSN Uniform on the site, and it looks nicely justified

    JSN Uniform example

  • val
    Replied on December 2, 2014 at 12:22 PM

    Hi,

    You've created a thread for this question and you will be answered here: http://www.jotform.com/answers/468212-Removing-top-margins

    Thanks.

     

  • webflunky
    Replied on December 2, 2014 at 3:02 PM

    I agree with PodiumMC. I feel that the margins and padding should all be 0 and if you need more, add it. It's usually easier for me to adjust padding and margins on my site than it is on JotForm. It's opposite of the way it should be. Maybe there is a form template available that is already set with no margins. If so, I think I'll start with that for everything.

  • Mike_T Jotform Support
    Replied on December 2, 2014 at 4:23 PM

    @webflunky, @PodiumMC,

    Mentioned top padding is being added as a part of default Form Designer theme.

    If you create/clone a new form, it will not have that padding until you edit the form in the new Form Designer.

    I have attached a ticket to this thread to see if we can add some 'clean' theme to the Form Designer option or implement some other solution.

    Thank you.