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

    Divide appointment widget into 3 or 4 columns.

    Asked by brentitc on August 30, 2016 at 11:25 PM

    hi!

    Is there a way of dividing the appointment slots into 3 or 4 columns?

     

    Thank you! 

    3 appointment appointment widget divide
  • Profile Image
    JotForm Support

    Answered by Chriistian on August 31, 2016 at 05:13 AM

    Yes, you can have the appointment slots into 4 columns. Simply follow the steps below.

    1. First, we need to widen the the appointment slot widget to fit the 4 columns. Simply select the widget and click on the Width property from the top menu. Set it to 600.

    2. Then simply add the CSS code below to each of the Appointment Slot widget's Custom CSS area.

    #checklist li {

        width: 25% !important;

    }

    3. Update the widget and it should now look like the image below.

    If you need further assistance, please let us know.
    Regards.

  • Profile Image

    Answered by brentitc on August 31, 2016 at 08:04 PM

    thanks. but i have noticed that the time sequence are messed-up.  is there a way to fix this. i really appreciate the help. 

  • Profile Image

    Answered by brentitc on August 31, 2016 at 08:45 PM
    tried the steps. these is the result.
    [image: Inline image 1][image: Inline image 2]
    ...
  • Profile Image
    JotForm Support

    Answered by Chriistian on August 31, 2016 at 10:01 PM

    Unfortunately your screenshot did not reach the forum. To send a screenshot, please follow this guide: How to add screenshots/images to questions to the support forum?

    As for the widget, please remove all the previous code in the Custom CSS area of the Appointment Slots widget and replace it with the code below:

    #checklist li{

    float:left;

    height: 80px;

    border-right: 1px solid lightgray;

    width: 24.8% !important;

    }

    Here's how it should look after.

    If you need further assistance, please let us know.
    Regards.