How to position a field to the right of the video?

I have embedded a video on my form aligned left.  I'd like to place the next question label on the same line aligned right so it looks like this form.  http://screencast.com/t/4tnQvgz5Z

Can I get the CSS or commands to do this?

http://www.jotform.com//?formID=51907272946968

Thanks,

Steve

To do that Steve, you should add the following CSS to your form:

.form-line.form-line-column.form-col-2 {
    margin-top: 40px;
    max-width: 52%;
}
#id_58 {
    clear: both;
    float: none;
}

This is how it should look like afterwards:

Now if you want that part with the video to be slightly more elevated - closer to the text above, then simply add this CSS code as well (next to the one above):

#id_97 {
    margin-bottom: -60px;
}

To add the CSS you should follow the steps in this guide: Inject Custom CSS Codes but please note that you should add the CSS code after all the other code so add it at the bottom of the fields.

Do let us know how it goes and if there is anything else that we can assist you with and we would be happy to do so.

Hey Ben - Thanks for this.  I added the code in the From Styles preference, and it's moving just the label up to the line above.  the radio buttons remain on the next level down.  Did  you change the font size or label width in your example?

Her's how mine is displaying now: http://form.jotformpro.com/form/51907272946968?

Steve

OK - I got the Radio buttons to come up.  I had a {} in the wrong place. But now I can't get this to work?

Now if you want that part with the video to be slightly more elevated - closer to the text above, then simply add this CSS code as well (next to the one above):

#id_97 {
    margin-bottom: -60px;
}

I believe what my colleague, Ben, is suggesting is this: 

When you insert the CSS codes provided by Ben, please insert it as shown on the image below.

/* - this signifies that codes that come after it is just comments. That is why nothing happens when you insert it on your codes.

Your form should look like this after: 

I hope this helps. Let us know if you need any further assistance. Thank you.

I've got most of it, but cam I align the top of the text with the top of the video frame?

http://screencast.com/t/tnjPJ6Gb5ThK

Steve

Your form may look a liitle bit odd on your Form Builder but once you load it or preview it it should look perfectly. 

Kindly add this CSS codes on your form to accomplish your request from your last reply: 

#cid_1, #label_1{

position: relative !important;

top: 28px !important;

}

It should look like this: 

Note: If you added Ben's code to reduce the space between the video and the text above it, you may need to adjust the value of the top: 28px !important; that I have provided. 

I hope this helps. Thank you. 

I'm not able to make it work... Here's what I have.  I'm running out of time.  Can you fix it for me? I'm getting frustrated.

Steve

I'm sorry if I have to cut your reply short. Please use a third-party tool like PASTEBIN, if you will be posting long codes like the CSS codes from your form. 

I have checked the codes you have posted. I have noticed that you inserted the code I have provided above at the end of your Form's CSS codes. 

I would suggest you try to insert it before the /* | *//*__INSPECT_SEPERATOR__*/

as shown on the image below: 

You can check the result by clicking the link of the form I used for testing: http://form.jotformpro.com/form/51922004837957. Please feel free to clone it to check the codes. 

Or you can copy the codes here: http://pastebin.com/raw.php?i=BdjiVFP6

I hope this helps. Thank you. 

Thanks! I just cloned it.

Steve

Great! Should you need any further assistance, please feel free to get back to us and we will be glad to help you anytime. Thank you.