Hey Leute, ich versuche gerade mehrere Dropdownmenüs zu gestalten.
Wenn ich folgendes in der CSS stehen habe
Zitat/* detail-selector & slider */
select { margin-left:5px; margin-right:5px;font-size:25px; }
.set,.attr { margin-bottom:5px; float:left; }
.slider { float:left; width:140px; height:26px; border:2px solid; color:grey; }
.set .slider { background:#F0F0D8; border-radius:8px; }
/* timepicker */
.set .set { margin-bottom:2px; margin-top:3px; }
.handle { position:relative; cursor:pointer; width:50px;
height:20px; line-height:20px; user-select:none;
border:3px solid; color:#278727; text-align:center; }
.downText { margin-top:2px; }
bekomme ich das Aussehen wie auf Bild 1
wenn ich:
Zitat/* detail-selector & slider */
select { margin-left:5px; margin-right:5px;font-size:25px;width:370px; }
.set,.attr { margin-bottom:5px; float:left; }
.slider { float:left; width:140px; height:26px; border:2px solid; color:grey; }
.set .slider { background:#F0F0D8; border-radius:8px; }
/* timepicker */
.set .set { margin-bottom:2px; margin-top:3px; }
.handle { position:relative; cursor:pointer; width:50px;
height:20px; line-height:20px; user-select:none;
border:3px solid; color:#278727; text-align:center; }
.downText { margin-top:2px; }
dann bekomme ich es wie in Bild 2.
Ich möchte aber für das Device Heizungsprogramm die Länge separat verstellen können, aber bekomme es nicht hin.
Kann mir jemand sagen, was ich eintragen muss, damit ich jedes Device einzeln einstellen kann?
Grüße Marcel
Du kannst jedes div einzeln über die id ansprechen plus den zusatz das du alle child-elemente "select" ändern möchtest.
/* detail-selector & slider */
#div-name_des_device_1 select { margin-left:5px; margin-right:5px;font-size:25px;width:170px; }
#div-name_des_device_2 select { margin-left:5px; margin-right:5px;font-size:25px;width:270px; }
#div-name_des_device_3 select { margin-left:5px; margin-right:5px;font-size:25px;width:370px; }
select { margin-left:5px; margin-right:5px;font-size:25px; }
.set,.attr { margin-bottom:5px; float:left; }
.slider { float:left; width:140px; height:26px; border:2px solid; color:grey; }
.set .slider { background:#F0F0D8; border-radius:8px; }
/* timepicker */
.set .set { margin-bottom:2px; margin-top:3px; }
.handle { position:relative; cursor:pointer; width:50px;
height:20px; line-height:20px; user-select:none;
border:3px solid; color:#278727; text-align:center; }
.downText { margin-top:2px; }
Super, das probiere ich nachher direkt mal aus...
Ich werde berichten...
Tapatalk iPhone, daher kurz gehalten.
Zitat von: mchilli am 22 Juli 2018, 12:41:47
Du kannst jedes div einzeln über die id ansprechen plus den zusatz das du alle child-elemente "select" ändern möchtest.
/* detail-selector & slider */
#div-name_des_device_1 select { margin-left:5px; margin-right:5px;font-size:25px;width:170px; }
#div-name_des_device_2 select { margin-left:5px; margin-right:5px;font-size:25px;width:270px; }
#div-name_des_device_3 select { margin-left:5px; margin-right:5px;font-size:25px;width:370px; }
select { margin-left:5px; margin-right:5px;font-size:25px; }
.set,.attr { margin-bottom:5px; float:left; }
.slider { float:left; width:140px; height:26px; border:2px solid; color:grey; }
.set .slider { background:#F0F0D8; border-radius:8px; }
/* timepicker */
.set .set { margin-bottom:2px; margin-top:3px; }
.handle { position:relative; cursor:pointer; width:50px;
height:20px; line-height:20px; user-select:none;
border:3px solid; color:#278727; text-align:center; }
.downText { margin-top:2px; }
Vielen Dank, hat funktioniert...!