CSS: Come posso allineare due Elementi Ora sulla stessa Riga?

negli orari vorrei avere due campi affianco come da mockup: es in una sola riga dobbiamo avere sia per inserire l'orario di lunedi mattina e lunedì pomeriggio, nella seconda colonna doppiamo mettere martedì mattina e martedì pomeriggio sempre sulla stessa riga

quello che vorrei fare io è questo come il mockup che segue: due orari nella stessa riga

Salve scoprifacile,

Grazie per aver contattato il supporto tecnico di Jotform. Allineare due campi "Ora" sulla stessa riga è possibile tramite CSS. Farlo è molto semplice, le spiego come fare:

1. Aggiungere i campi Ora per Martedì mattina e pomeriggio.
2. 
3. Nel Costruttore di Moduli, fare clic sul pulsante Designer Modulo, in alto a destra dello schermo.
4. Quindi, fare clic sulla scheda Stile.
5. Scorrere fino a Inserisci CSS Personalizzato e incollare il codice fornito di seguito:

/* Align Time fields on desktop devices - 12798321*/

@media only screen and (min-width: 700px) {

#id_31 {

    margin: -136px 0px 0px 332px; /*lunedì pomeriggio*/

}

#id_34 {

    margin: -134px 0px 0px 332px; /*martedì pomeriggio*/

}

}

/* Align Time fields on mobile devices - 12798321*/

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

#id_31 {

    margin: -236px 0px 0px 203px; /*lunedì pomeriggio*/

}

#id_34 {

    margin: -236px 0px 0px 198px; /*martedì pomeriggio*/

}

}

/* Code Ends Here*/

È possibile che il campo Martedì pomeriggio abbia un ID differente, dunque le mostro come può controllare l'ID del suo campo:

1. Nel suo modulo, fare clic sul campo martedì pomeriggio.
2. Successivamente, fare clic sull'icona a forma di ingranaggio per aprire il pannello proprietà sulla destra dello schermo.
3. Fare clic sulla scheda Avanzate, poi scorrere verso il basso fino a Dettagli del Campo e aprire la sezione nascosta facendo clic.
4. Sotto alla sezione ID Campo, controllare il numero presente.
5. Infine, se il numero è diverso modificare il codice CSS #id_34 con il numero del ID Campo.

Risultato su Desktop:

Risultato su Smartphone:

Qui può testare questo modulo di prova o clonarlo per capire meglio come è stato configurato.

Restiamo a sua disposizione per ulteriori chiarimenti.

mi servirebbe il codice e come farlo per tutti i giorni della settimana se è possibile, cioè da lunedì a domenica.

Buongiorno scoprifacile,

Grazie per averci contattato nuovamente. Ho controllato il suo modulo con ID 240714747024352 e ho potuto notare che è riuscito ad applicare il codice CSS a tutti i campi Ora.

Ho anche potuto notare che il codice funziona bene sia su dispositivi Desktop che mobili.

Ci faccia sapere se ha bisogno di ulteriori chiarimenti.