Hallo,
bis vor kurzem schien alles bei mir zu laufen,
nach irgendeinem Update, waren die Icons aufeinmal untereinander statt nebeneinander.
Was mache ich falsch?
<li data-row="5" data-col="9" data-sizex="2" data-sizey="1">
<header>Müll</header>
<div class="top-space inline"><div data-type="symbol" data-background-icon="fa-circle-thin " data-off-background-color="white" data-on-background-color="white" data-device="GelberSack" data-get='STATE' data-off-color="yellow" data-get-on='["off","^[01]$","^[1-9][0-9]|[2-9]$"]' data-icons='["fa-trash warn","fa-trash warn blink","fa-trash warn"]' data-on-colors='["yellow","yellow","yellow"]' class="small"></div>
<div class="top-space inline"><div data-type="symbol" data-background-icon="fa-circle-thin " data-off-background-color="white" data-on-background-color="white" data-device="Papiertonne" data-get='STATE' data-off-color="green" data-get-on='["off","^[01]$","^[1-9][0-9]|[2-9]$"]' data-icons='["fa-trash warn","fa-trash warn blink","fa-trash warn"]' data-on-colors='["blue","blue","blue"]' class="big"></div>
<div class="top-space inline"><div data-type="symbol" data-background-icon="fa-circle-thin " data-off-background-color="white" data-on-background-color="white" data-device="Restmuell" data-get='STATE' data-off-color="grey" data-get-on='["off","^[01]$","^[1-9][0-9]|[2-9]$"]' data-icons='["fa-trash warn","fa-trash warn blink","fa-trash warn"]' data-on-colors='["gray","gray","gray"]' class="big"></div>
</li>
Reicht der Platz noch, für drei Elemente nebeneinder?
Vllt. Musst du jetzt aus dem "big" eher ein "large" machen?
leider nicht, habe Big, Large, Small ausprobiert, immer untereinander,
Es war ja am Anfang komplett ok.
dir fehlt ein abschließendes </div> (oder du lässt das kapselnde div vorne weg und schreibst alles in eine class)
<li data-row="5" data-col="9" data-sizex="2" data-sizey="1">
<header>Müll</header>
<div data-type="symbol" data-background-icon="fa-circle-thin " data-off-background-color="white" data-on-background-color="white" data-device="GelberSack" data-get='STATE' data-off-color="yellow" data-get-on='["off","^[01]$","^[1-9][0-9]|[2-9]$"]' data-icons='["fa-trash warn","fa-trash warn blink","fa-trash warn"]' data-on-colors='["yellow","yellow","yellow"]' class="big inline top-space"></div>
<div data-type="symbol" data-background-icon="fa-circle-thin " data-off-background-color="white" data-on-background-color="white" data-device="Papiertonne" data-get='STATE' data-off-color="green" data-get-on='["off","^[01]$","^[1-9][0-9]|[2-9]$"]' data-icons='["fa-trash warn","fa-trash warn blink","fa-trash warn"]' data-on-colors='["blue","blue","blue"]' class="big inline top-space"></div>
<div data-type="symbol" data-background-icon="fa-circle-thin " data-off-background-color="white" data-on-background-color="white" data-device="Restmuell" data-get='STATE' data-off-color="grey" data-get-on='["off","^[01]$","^[1-9][0-9]|[2-9]$"]' data-icons='["fa-trash warn","fa-trash warn blink","fa-trash warn"]' data-on-colors='["gray","gray","gray"]' class="big inline top-space"></div>
</li>
oder noch einfache hbox verwenden!
wenn ich da ein abschliessendes </div> reinmache haut es das ganze Layout durcheinander.
Es fehlt dann ja auch das einleitende <div> davor. Oder eben alles in ein <div class="hbox"></div> packen und die "inline" aus class rauswerfen.
versuch mal meine Variante mit 4 nebeneinander. Mußt du dir nur eben anpassen auf 3 und die Symbole..
<div class="sheet">
<div class="row">
<div class="cell"
data-type="symbol"
data-device="myAbfall"
data-get-warn="(\d+)"
data-get="Restmuell_tage"
data-icons='["fs-dustbin warn","fs-dustbin warn fa-spin","fs-dustbin warn"]'
data-on-colors='["#778899","#778899","#778899"]'
data-get-on='["(1|2|3|4|5|6|7|8|9|10|11|12|13|14|15|16|17)","(0)","(18|19|20|21|22|23|24|25|26|27|28|29|30|31)"]'
data-background-icon="fa-circle-thin"
data-off-background-color="#7A7A7A"
data-on-background-color="#7A7A7A">
</div>
<div class="cell"
data-type="symbol"
data-device="myAbfall"
data-get-warn="(\d+)"
data-get="GelberSackLeichtverpackungen_tage"
data-icons='["fs-bag warn","fs-bag warn fa-spin","fs-bag warn"]'
data-on-colors='["yellow","yellow","yellow"]'
data-get-on='["(1|2|3|4|5|6|7|8|9|10|11|12|13|14|15|16|17)","(0)","(18|19|20|21|22|23|24|25|26|27|28|29|30|31)"]'
data-background-icon="fa-circle-thin"
data-off-background-color="#7A7A7A"
data-on-background-color="#7A7A7A">
</div>
<div class="cell"
data-type="symbol"
data-device="myAbfall"
data-get-warn="(\d+)"
data-get="PapierAbfall_tage"
data-icons='["fs-bag warn","fs-bag warn fa-spin","fs-bag warn"]'
data-on-colors='["royalblue","royalblue","royalblue"]'
data-get-on='["(1|2|3|4|5|6|7|8|9|10|11|12|13|14|15|16|17)","(0)","(18|19|20|21|22|23|24|25|26|27|28|29|30|31)"]'
data-background-icon="fa-circle-thin"
data-off-background-color="#7A7A7A"
data-on-background-color="#7A7A7A">
</div>
<div class="cell"
data-type="symbol"
data-device="myAbfall"
data-get-warn="(\d+)"
data-get="BioabfallGruengut_tage"
data-icons='["fs-bag warn","fs-bag warn fa-spin","fs-bag warn"]'
data-on-colors='["limegreen","limegreen","limegreen"]'
data-get-on='["(1|2|3|4|5|6|7|8|9|10|11|12|13|14|15|16|17)","(0)","(18|19|20|21|22|23|24|25|26|27|28|29|30|31)"]'
data-background-icon="fa-circle-thin"
data-off-background-color="#7A7A7A"
data-on-background-color="#7A7A7A">
</div>
</div>
</div>
Zitat von: hyper2910 am 07 Februar 2017, 12:48:46
wenn ich da ein abschliessendes </div> reinmache haut es das ganze Layout durcheinander.
dann hast du wo anderst auch noch ein problem
Zitat von: sinus61 am 07 Februar 2017, 13:16:54
Es fehlt dann ja auch das einleitende <div> davor
nö, das hat er ja in seiem beispiel in post 1, abe rnicht wieder zugemacht. wenn s im beim zumachen das layout zerhaut hat er dohl wo anderst auch noch eines offen
wenn man aus dem bsp in post 1 mal was übersichtliches baut sieht man dass das ende fehlt
<li data-row="5" data-col="9" data-sizex="2" data-sizey="1">
<header>Müll</header>
<div class="top-space inline">
<div data-type="symbol" ... class="small"></div>
<div class="top-space inline">
<div data-type="symbol" ... class="big"></div>
<div class="top-space inline">
<div data-type="symbol" ... class="big"></div>
</li>
3x fehlt das sogar. In jeder Zeile eins
jab
danke, habe es
<li data-row="5" data-col="9" data-sizex="2" data-sizey="1">
<header>Müll</header>
<div class="hbox">
<div data-type="symbol" data-background-icon="fa-circle-thin " data-off-background-color="white" data-on-background-color="white" data-device="GelberSack" data-get='STATE' data-off-color="yellow" data-get-on='["off","^[01]$","^[1-9][0-9]|[2-9]$"]' data-icons='["fa-trash warn","fa-trash warn blink","fa-trash warn"]' data-on-colors='["yellow","yellow","yellow"]' class="big"></div>
<div data-type="symbol" data-background-icon="fa-circle-thin " data-off-background-color="white" data-on-background-color="white" data-device="Papiertonne" data-get='STATE' data-off-color="green" data-get-on='["off","^[01]$","^[1-9][0-9]|[2-9]$"]' data-icons='["fa-trash warn","fa-trash warn blink","fa-trash warn"]' data-on-colors='["blue","blue","blue"]' class="big"></div>
<div data-type="symbol" data-background-icon="fa-circle-thin " data-off-background-color="white" data-on-background-color="white" data-device="Restmuell" data-get='STATE' data-off-color="grey" data-get-on='["off","^[01]$","^[1-9][0-9]|[2-9]$"]' data-icons='["fa-trash warn","fa-trash warn blink","fa-trash warn"]' data-on-colors='["gray","gray","gray"]' class="big"></div>
</li>
supi, aber es fehlt wieder der Abschluss vor dem </li>
ein </div>
<li data-row="5" data-col="9" data-sizex="2" data-sizey="1">
<header>Müll</header>
<div class="hbox">
<div data-type="....class="big"></div>
<div data-type="....' class="big"></div>
<div data-type="... class="big"></div>
</div>
</li>
es funktioniert aber!
Die Browser korrigiert vieles, aber genau so etwas kann die Quelle von "Alles verschoben", "Warum ist das nicht nebeneinander" usw. sein