Customising the Width Of Certain Boxes

I am currently creating the following form - http://www.jotformpro.com/form/51719069683971

How do I make the width of the following boxes the same length as all the other boxes:

-  Phone Number

- Number Of Products 

Notice how all other boxes are neatly aligned on the right hand margin with the exception of these two.

Thanks.

By just changing the width value in the form builder. I did it for you. Kindly check now.

Thanks

Thank you. Solved.

One other question:

I recently checked my form on a mobile device.

The change you suggested to extend the width of the "phone number" box as well as the "number of products" dropdown are not responsive.

How can we make these responsive?

See images below (sorry for the size. I don't know how to shrink them):

Inject this CSS code to your form, this should make all framed widgets mobile responsive.

@media screen and (max-width:760px){

iframe{width:100% !important;}

}

Guide: http://www.jotform.com/help/117-How-to-Inject-Custom-CSS-Codes-to-your-Form

If you need further assistance, let us know.

That has fixed the issue with "phone number" but not the issue with the "number of products" drop down.

How can we fix both of these?

You can try adding this custom CSS code inside the @media rule:

#id_39 {

        width : 100% !important;

    }

    #input_39 {

        min-width: 210px !important;

    }

Make sure to add it inside the media rule, the media rule is the specific styling that the form will use when it is viewed on a device matching the said media screen sizes. In this case, you can adjust the widths and try experimenting.

Thanks for your support.