Frage Checkbox mit Text und Eingabefeld ausrichten

[FloriD]

Hallo zusammen,

ich nutze für eine Rollladensteuerung einen Webserver auf einem ESP8266 (Arduino). Der Webcode dafür besteht aus ein wenig HTML, CSS und JS - siehe Anhang.
Im unteren Bereich befinden sich Zeilen, die aus einer Checkbox mit Text und einem Eingabefeld für eine Zeit bestehen. Was mir leider nicht gelungen ist, ist die beiden Elemente "vernünftig" auszurichten. Ich habe mir mit weißen Rechtecken ausgeholfen (im angehängten Code/Screenshot zur Verdeutlichung in grau), um die Eingabefelder hochzuschieben, aber sauber ist das nicht.
Habt Ihr einen Tipp, wie ich das besser hinbekomme?

Danke,
Florian

 

[tk1234]

Im unteren Bereich befinden sich Zeilen, die aus einer Checkbox mit Text und einem Eingabefeld für eine Zeit bestehen. Was mir leider nicht gelungen ist, ist die beiden Elemente "vernünftig" auszurichten. Ich habe mir mit weißen Rechtecken ausgeholfen (im angehängten Code/Screenshot zur Verdeutlichung in grau), um die Eingabefelder hochzuschieben, aber sauber ist das nicht.
Habt Ihr einen Tipp, wie ich das besser hinbekomme?

Indem du die jeweils zusammengehörenden Checkboxen und Zeitfelder jeweils zusammen lässt und nicht auseinander reißt: wenn du nach jede Checkbox das dazugehörige Zeitfeld setzt, die divs checkbox-column und time-column rauswirfst und dann ein grid-Layout mit zwei Spalten daraus machst (checkboxen in die erste und Zeitfelder in die zweite Spalte) stehen die zusammengehörenden Zeilen auf gleicher Höhe.