What is JotForm?
JotForm is a free online form builder which helps you create online forms without writing a single line of code. No sign-up required.

At JotForm, we want to make sure that you’re getting the online form builder help that you need. Our friendly customer support team is available 24/7.

We believe that if one user has a question, there could be more users who may have the same question. This is why many of our support forum threads are public and available to be searched and viewed. If you’d like help immediately, feel free to search for a similar question, or submit your question or concern.


  • Profile Image

    Would like to place the entire form (centered) in a container with rounded corners

    Asked by leadPops28 on September 26, 2014 at 05:02 AM
    3. would like to place the entire form (centered) in a container with rounded corners -- can you help with this too?
    centering jotform jotform css custom CSS CSS shadows CSS round borders
  • Profile Image
    JotForm Support

    Answered by Welvin on September 26, 2014 at 06:17 AM

    Hi,

    Do you mean, like this:

    If yes, simply inject the following custom CSS codes to your form:

    .form-all {

    border: 1px solid #ccc;

    border-radius: 10px;

    box-shadow: 0px 3px 3px 3px;

    }

    The same guide for  injecting these codes: https://www.jotform.com/help/117-How-to-Inject-Custom-CSS-Codes.

    Thank you!

  • Profile Image

    Answered by leadPops28 on September 26, 2014 at 09:21 AM
    Hi Welvin,
    Thanks for the response. That looks like what I'm trying to do... I tried
    injecting the
    CSS into the form with no luck. I already have some other custom CSS in
    there...
    Any tips or advice on making this work for my jotform? Thanks for your help
    in advance.
    ...
  • Profile Image

    Answered by Ben on September 26, 2014 at 10:38 AM

    Hi,

    I have cloned your jotform and I see that the reason why it did not work for you is because there was no . (dot) in front of the class name when you have copied it over from my colleague Welvin above.

    Please copy this code including the dot as well. I have also added the code that slightly moves it from the top of the page so that the frame is nicely shown

    .form-all
    {
       margin-top: 5px;
       border: 1px solid #ccc;
       border-radius: 10px;
       box-shadow: 0px 3px 3px 3px;
    }

    If you can not make it work, I suggest cloning this jotform ( http://form.jotformpro.com/form/42684587031964 ) to your account instead. See here how to Clone an Existing Form from a URL.

    Best Regards,
    Ben