MachForm Community Forums » MachForm 3

1. Lazarix
   Member

   Hi guys, I just wanted to say that this is a fantastic product and already i'm making a lot of progress!
   I've read
   http://www.appnitro.com/forums/topic/label-038-input-box-on-same-lin?replies=17
   about how to get a text field label to sit to the left of the field, but I just can't seem to make it happen.
   I've modified the label.description in the view.css relating to my form (as opposed to the main view.css) and set:
   width: 150%;
   float: left;
   (150% because if i set it shorter, the label text splits into two lines)
   I've also set the textarea.textarea width to 50% as suggested but it still sits on top of the text field.
   Ideas?
   http://www.tjwcontracts.co.uk/forms/view.php?id=1
   The embedded form is here and looks a bit better at 100%:
   http://www.tjwcontracts.co.uk/Beta/mileage6.php

   Posted 11 years ago #

2. Lazarix
   Member

   Incidentally, I've also ran firebug but I can't seem to find the right property to modify to make it happen.

   Posted 11 years ago #

3. Lazarix
   Member

   Anyone have any ideas on this?

   Posted 11 years ago #
4. 

   yuniar

   You don't need any modification for this. Simply open your form properties tab, click "show more options" and then set the Label Alignment property to "Left Aligned" or "Right Aligned"

   ---

   MachForm Founder

   Posted 11 years ago #

5. Lazarix
   Member

   Won't that do it for all fields in the form though?
   I'd only like to do it for certain fields.

   Posted 11 years ago #

6. Lazarix
   Member

   Also, if you set that property, it stops you from lining fields up in the same line. (I.E. column_3)

   Posted 11 years ago #

7. Lazarix
   Member

   Any ideas would be helpful as i'm really struggling with this now :(

   Posted 11 years ago #
8. 

   redityo

   Hi,

   Have you try to put these css code into your form "advance css" code ?

   #li_4 label.description {
       float: left !important    ;
       width: 42% !important;
   }
   
   #li_4 input.text {
   clear:none !important;
   }
   
   #li_9 label.description {
       float: left !important    ;
       width: 42% !important;
   }
   
   #li_9 input.text {
   clear:none !important;
   }
   
   #li_14 label.description {
       float: left !important    ;
       width: 42% !important;
   }
   
   #li_14 input.text {
   clear:none !important;
   }
   
   #li_19 label.description {
       float: left !important    ;
       width: 42% !important;
   }
   
   #li_19 input.text {
   clear:none !important;
   }
   
   #li_24 label.description {
       float: left !important    ;
       width: 42% !important;
   }
   
   #li_24 input.text {
   clear:none !important;
   }
   
   #li_29 label.description {
       float: left !important    ;
       width: 42% !important;
   }
   
   #li_29 input.text {
   clear:none !important;
   }
   
   #li_43 label.description {
       float: left !important    ;
       width: 42% !important;
   }
   
   #li_43 input.text {
   clear:none !important;
   }
   
   #li_38 label.description {
       float: left !important    ;
       width: 42% !important;
   }
   
   #li_38 input.text {
   clear:none !important;
   }
   
   #li_51 label.description {
       float: left !important    ;
       width: 42% !important;
   }
   
   #li_51 input.text {
   clear:none !important;
   }
   
   #li_58 label.description {
       float: left !important    ;
       width: 40% !important;
   }
   
   #li_58 input.text {
   clear:none !important;
   }

   I have reply your ticket before, if you still having any problem on this, please send us your machform detail login info to :

   customer.service[at]appnitro.com

   I will help you to adjust the field directly.

   ---

   MachForm Support

   Posted 11 years ago #

9. Lazarix
   Member

   Thanks Redityo!
   That works perfectly except for one small thing.
   The checkbox element 44 doesn't seem to adhere to the above.

   The code is:
   


   <li id="li_44" class="column_7 new_row">
   <label class="description">Cost Incurred</label>
   <div>
   <span>
   <input id="element_44_1" name="element_44_1" class="element checkbox" type="checkbox" value="1"/>
   <label class="choice" for="element_44_1"/>
   </span>
   </div>
   </li>

   I've tried:
   


   #li_44 label.description { float: left !important ; width: 42% !important; }
   #li_44_1 input.checkbox { clear:none !important; }

   
   And also:
   


   #li_44 label.description { float: left !important ; width: 42% !important; }
   #li_44 input.checkbox { clear:none !important; }

   
   And also:
   


   #li_44 label.description { float: left !important ; width: 42% !important; }
   #li_44 input.text { clear:none !important; }

   
   but it doesn't seem to make a difference.

   Yes, I have created a "custom" 7 column style but it works just fine for the text input fields.

   Posted 11 years ago #

10. Lazarix
    Member

    Any ideas on the above?

    Posted 11 years ago #

11. daltx7
    Member

    I am trying something similar and have seen two types of code for this. Either code works on my first field only, but the remaining three are unresponsive. I have tried this:

    #li_1 label.description {
    float: left !important ;
    width: 42% !important;
    }

    #li_1 input.text {
    clear:none !important;
    }

    #li_2 label.description {
    float: left !important ;
    width: 42% !important;
    }

    #li_2 input.text {
    clear:none !important;
    }

    And has the same effect as this:

    #li_1 label.description, #li_2 label.description, #li_3 label.description{
    width: 25%; !important;
    float: right; !important;
    }

    #li_1 input.text, #li_2 input.text, #li_3 input.text{
    width:15%; !important;
    float: left; !important;
    }

    The latter I am trying to perform on three fields.

    I am actually trying to place three successive fields in alignment LABEL TEXT On three different lines. Something tells me I have to insert code to break the lines. Any suggestions?

    Posted 10 years ago #

12. daltx7
    Member

    Well, success comes to the patient. I have found the solution as I had the label id's wrong, and a quick review with firebug corrected. Thanks to those who assisted.

    Posted 10 years ago #

RSS feed for this topic

Reply

You must log in to post.