MachForm Community Forums » MachForm 2

1. vechnyak
   Member

   Ok the software is great and I was able to create the form in minues, but its all one very long column. Can I now modify the file in my dreamweaver to move the fields where I want them to be? What file is that?

   Posted 15 years ago #

2. walags
   Member

   do a search on the forums. in the admin panel you edit the css file for each form to adjust layout as you wish.

   Posted 15 years ago #

3. vechnyak
   Member

   Thanks I did the search and found reference to some code. Something like this:
   #li_2{
   float: left;
   width: 35%;
   clear: both;
   }

   #li_3{
   width: 55%;
   }

   This works but only for one line. If I start using the same logic and add lines like li_4 li_5 the forms gets really messed up and becomes unreadable.
   I've googled for CSS reference trying to understand what #li means but did not find anything. My coding skills are pretty poor, but I really would like to understand what #li_ means and how it works.

   Any input is much appreciated.

   BTW, Overall the product rocks!!! Very Very nice

   Posted 15 years ago #

4. walags
   Member

   you have to play with the width percentage. when putting more than two elements on a line you need "clear: both;" only on the first one and "float: left;" on all.

   #li_2{
   float: left;
   width: 30%;
   clear: both;
   }
   #li_3{
   float: left;
   width: 30%;
   }
   #li_3{
   float: left;
   width: 30%;
   }

   Posted 15 years ago #
5. 

   yuniar

   hi vechnyak -- If you could post the URL to your form, and let us know how would you like your form to be. We might be able to help you better.

   But walags already covers the important things though.

   ---

   MachForm Founder

   Posted 15 years ago #

6. vechnyak
   Member

   Thank You! here is the form

   http://www.redumbrellastudio.com/machform/view.php?id=5

   for example, i was able to make Event Date and Event type on one line. Thats good, but in similar way I would like to now make Phone and email to be on one line. Further down there is another Phone and email, which also would be nice to have on one line.

   BTW, what does #li_ mean? In the above code does it mean line2 line3 and so on?

   Thank You All again!

   Posted 15 years ago #

7. walags
   Member

   not sure what the initials are for but #li_X refers to the fields of your form. if you view the source of your webpage you can see them.

   Posted 15 years ago #
8. 

   yuniar

   Ok, so #li_1, #li_2, #li_3, etc are id of your fields.
   If you check the HTML source of your form, you'll see your fields enclosed with those ids.

   To align certain fields, you need to get the proper id first.
   Your first Phone and Email field is having id li_7 and li_5, so the code for these fields would be:

   #li_7{
     float: left;
     width: 35%;
     clear: both;
   }
   
   #li_5{
     width: 55%;
   }

   Your second Phone and Email field is having id li_6 and li_8, so the code for these fields would be:

   #li_6{
     float: left;
     width: 35%;
     clear: both;
   }
   
   #li_8{
     width: 55%;
   }

   Append those codes and your fields should be aligned properly.

   ---

   MachForm Founder

   Posted 15 years ago #

9. vechnyak
   Member

   Very nice! Thank you!

   Posted 15 years ago #

RSS feed for this topic

Reply

You must log in to post.