Alignment issues on mobile platforms

Is it possible to have the text in the radio button section wrap evenly at the beginning? I had responsive css here but now it doesn't seem to work. This section also now overlaps on my iPhone.

Also, on my iPhone, it appears the Casa Spazio logo near the bottom of the form is stretching vertically. Can this be resolved?

For the changes which you have mentioned on your post, you can try to use the following code from the below:

 

@media screen and (min-width: 10px) and (max-width: 400px){

span.form-radio-item {

    width: 150px !important;

}

img{

width: 10%;

height: auto;

}

}

 

@media screen and (min-width: 401px) and (max-width: 600px){

span.form-radio-item {

    width: 250px !important;

}

img{

width: 15%;

height: auto;

}

}

 

@media screen and (min-width: 601px) and (max-width: 2400px){

span.form-radio-item {

    width: 325px !important;

}

img{

width: 25%;

height: auto;

}

}

 

.form-section {

    width: 80%;

    margin: auto;

}

 

Also, please don't forget to let us know the results.

Regards.

No good. It changes the 2 columns of radio buttons into one column and makes the header image smaller:

Could you try adding the CSS code provided below:

.form-radio-item {

white-space: normal !important;

    display: inline-block !important;

    padding-right: 12px !important;

}

I've cloned your JotForm to my account and added the above CSS code. I've checked the form on a iPhone emulator see the following.

Hope this information helps! Please get back to us if you need any further assistance. We will be happy to help. 

Hmm, your screenshot doesn't show what I am after. I'd like all the text to align on the left to the riht of the radio buttons - not wrap under the button. Just as it does below:

Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop publishing software like Aldus PageMaker including versions of Lorem Ipsum. Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop publishing software like Aldus PageMaker including versions of Lorem Ipsum. Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop publishing software like Aldus PageMaker including versions of Lorem Ipsum.

Ok. Could you try injecting the following CSS code to see the result as shown below:

.form-radio-item label {

    white-space: normal;

    display: block;

    margin-top: -18px;

    padding-left: 17px;

}

I believe this is something you are looking for. If you need any further assistance, please let us know. We will be happy to help. 

That solved it!! Thank you so much.

I am glad to know that your issue has been resolved. On behalf of my colleagues, you are most welcome. Feel free to contact us again if you have any other concerns. Cheers.