Align the 2 Time fields in mobile view portrait mode

hola estaba trabajando con 2 preguntas contraídas, en formato de escritorio se ve así

se ve bien y como espero, pero como el formulario apunta que se llene en especial al formato móvil y de modo vertical, como puedo hacer que se vea así de la misma forma que se vea como en en la imagen de arriba y no de abajo, por temas practico no puedo dar vuelta la orientación del celular.

Hi Fumysam,

Thanks for contacting Jotform Support. Our Spanish Support team is not available at the moment. Hence, I am using a language translating tool to respond to this ticket and responding in English. If you want us to forward your ticket to our Spanish team, we can do so, but there could be a delay in response.

Regarding your concern, please add this CSS into your form:

#id_408 {

  width : 200px;

}

#id_409 {

  width : 200px;

}

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

li#id_409 {

position: absolute;

margin-top: 300px;

margin-left: 150px;

}

RESULT:

Give it a try and let us know how it goes.

hola buenas agradecerias más información de como hacerlo y donde

Hi Fumysam,

You will need to edit your form, go to the Form Build page. Thereafter,

1. Open the Form Designer – Paint brush icon shown on the right side of the form build page
2. Go to the Styles tab
3. Scroll down to the Insert Custom CSS section and paste the provided code above.
4. Scroll down and click the green Save button.

See this video for more details:

Give it a try and let us know if you have any further questions.

tuve suerte con la ayuda pero no me quedo alineado

SUMADO AQUELLO COMO SE EL ID DE LA PREGUNTA EN CUESTIÓN?

Hi fumysamdigital,

You can add this CSS code to your form to align the Time fields in mobile view:

/*Align other Time field in mobile view*/

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

 li#id_409 {

  position: absolute;

  top: 35px;

 }

}

/*Ends here*/

Here's what it would look like:

As for your question on how to identify the ID of the field, you can get it from its Properties panel.

1. On Form Builder, select the field that you want to get the ID and click its Properties button

2. On the field's Properties panel that will show up on the right, go to the Advanced tab

3. Scroll down and expand the Field Details section. You should see the Field ID there

But if you're looking to get the ID to adjust/style the field using CSS code, that Field ID is only for the input section/text area of the field. If you want to adjust the whole field including the question text, input area, and sublabel, just replace the '#input' part with '#id'. This is useful if you are re-positioning the entire field like the CSS code I provided.

• For example, if the Field ID is showing #input_409_timeInput, replace that with #id_409

You can also use the Inspect tool of your browser to get this particular field ID. Here's a screencast showing how:

If you're not that familiar with CSS codes, you can check some sites that teach CSS codes for free like W3Schools. Or, you can just get back to us if you want to apply CSS codes to your other fields or forms.

Let us know if you have any other questions.