This forum is no longer open and is for reading/searching only.

Please use our new MachForm Community Forum instead.

MachForm Community Forums » MachForm 2

How do I get fields on the same line?


  1. anthonybest
    Member

    I am using the 2.0 Version of this software, and when i click embed code I do not get the HTML code for this form. I just see the iframe code for inserting it into a page.

    Getting that code would be extremely helpful for other activites I would like to do with these forms.

    How can i get the Full HTML code for my form?

    Posted 15 years ago #
  2. yuniar

    There is no Full HTML code to your form, you can only use the embed code (iframe or PHP include). Since all your forms are generated on the fly.

    A workaround for this would be manually viewing the HTML source of your form and then save it as an HTML file. Don't forget to adjust the form action path and the CSS path.


    MachForm Founder

    Posted 15 years ago #
  3. emgstudios
    Member

    Okay,

    I'm no coder but I think I'm pretty saavy but in my css I don't see anything referencing #li_1 or #li_"anything" so that I may add multiple entries on one line. What am I doing wrong?

    Posted 15 years ago #
  4. walags
    Member

    they are not there, you have to add them. at the end of the css you can add your custom code to manipulate the form fields.

    Posted 15 years ago #
  5. emgstudios
    Member

    ahhh.. got it! thanks so much..

    Posted 15 years ago #
  6. emgstudios
    Member

    One last question, but I will try anyway. If I re-order the lines in the form will the #li_"whatever" be the number of the line how it's ordered on the form, or with the number of the line be ordered by creation time?

    Posted 15 years ago #
  7. walags
    Member

    created. to see the number associated with fields open up your webpage with the form and view the source. you will see the fields numbered there.

    Posted 15 years ago #
  8. emgstudios
    Member

    Got it!! I got the fields on the same line. I lied when I said only one more question. What is all the xtra space in (default) yellow to the right of the input boxes, even though I didn't add instructions for input it still takes up a lot of space, how can I reduce the wasted space?

    In my form,

    http://www.thepaperbook.com/onlineforms/view.php?id=3

    see towards the bottom, the MM#, OMP#, MC#, area.

    Thanks so much.

    Posted 15 years ago #
  9. walags
    Member

    try to add "clear: both;" to the element causing that trouble.

    Posted 15 years ago #
  10. walags
    Member

    #li_2{
    float: left;
    width: 45%;
    clear: both;
    }
    #li_3{
    float: left;
    width: 45%;
    }
    #li_4{
    clear: both;
    }
    #li_7{
    float: left;
    width: 20%;
    clear: both;
    }
    #li_8{
    float: left;
    width: 20%;
    }
    #li_9{
    float: left;
    width: 20%;
    }
    #li_10{
    float: left;
    width: 20%;
    }
    #li_11{
    clear: both;
    }

    Posted 15 years ago #
  11. emgstudios
    Member

    Tried that it didn't work.. although it brought the boxes closer together, the input boxes also got smaller. I think it has something to do with the "Guidelines for User" area.

    While trying different things I even deleted the Guidelines area in the css and it the space remained the same.. If I nail down what it is, I'll put it here.. So others will know..

    Posted 15 years ago #
  12. emgstudios
    Member

    Alright.. here's what I what I found out. When using the #li_"whatever" for more than one line to be on the same line; I suggest setting the "field size" to "Large" this way the size of the input box stretches evenly across the line.

    http://www.thepaperbook.com/onlineforms/view.php?id=3

    Posted 15 years ago #
  13. yuniar

    emgstudios -- I think you forgot to add these:

    #li_15{
      clear: both;
    }
    
    #li_13{
      clear: both;
    }


    Two of your field doesn't align properly on firefox without those code.


    MachForm Founder

    Posted 15 years ago #
  14. melanieme
    Member

    And notice that some form elements are already side by side, such as the city and state in the address fields. The css that controls this is:

    #main_body form li div.left {
    	display:inline;
    	float:left;
    	width:48%;
    }
    #main_body form li div.right {
    	display:inline;
    	float:right;
    	width:48%;
    }

    You could easily adapt this css for the #li_number example given above.

    Posted 15 years ago #
  15. franki
    Member

    I'd like to jump in here and ask yuniar the css king :) how do I get the radios to go to the right of the label instead of underneath it? I have some Yes/No questions on my form and I think it would look much better if If I can get them to be stacked vertically to the right. If I can get the solution I'll be a very happy man! Thank you.

    Posted 15 years ago #
  16. yuniar

    you might want to check this:
    http://www.appnitro.com/forums/topic/radio-buttons-on-same-line?replies=7#post-329

    is that what you need?


    MachForm Founder

    Posted 15 years ago #
  17. franki
    Member

    Well sort of. I was looking to have the radios over to the right rather than below the field label.

    Thank you for your quick reply.

    Posted 15 years ago #
  18. yuniar

    Oh.. do you mean like this:
    http://www.appnitro.com/forms/view.php?id=20

    No?


    MachForm Founder

    Posted 15 years ago #
  19. franki
    Member

    Exactly right, yes. That's what I need right there.

    Thanks!

    Posted 15 years ago #
  20. yuniar

    Ahh.. great. That one is quite simple actually.
    Here is the CSS code:

    #li_2 label.description{
    	width: 40%; float: left;
    }

    Just change "li_2" with your own id.


    MachForm Founder

    Posted 15 years ago #

RSS feed for this topic

Reply »