Multiple Issue Question

  • Profile Image
    Asked on November 21, 2017 at 08:33 AM

    Q1: What CSS code should I inject to fix this overlapping label? This is on Page 6.


    Q2: How to move the date picker button a little bit to the right? This is on Page 1. I had 3 of this same date field with similar CSS codes for mobile on Page 2. However, it doesn't seem to work on this one.


    Q3: Using the same screenshot above, the date field has a Hover Description. I could view it using the browser version but I couldn't see it in the mobile version.

  • Profile Image
    Answered on November 21, 2017 at 11:07 AM


    For Q1. you can add this css to align the text properly:

    .form-label.form-label-left {
         display: table-cell;

    For Q2.and Q3 you can add this css to add margin-left and to view the form-description on small devices:

    @media (max-width: 480px){
        margin-left:10px; /* moves the calendar a little to the right*/

        margin-left:-500px !important;
        right:0px !important;

    Here is the form I have created feel free to clone it :