HI!
Kann mir jemand helfen die Vorhersage Zeilen automatisch auf die komplette Breite auszurichten?
Der Aktuelle Tag und und ganz unten der Pollenflug wird zentriert und auf die Gesammtbreite verteilt aber die Zeilen dazwischen leider nicht und ich finde den Fehler nicht...
HIer der Code und im Anhang das Bild...
<!DOCTYPE html>
<html>
</head>
<title>WETTER</title>
<meta http-equiv="Pragma" content="no-cache">
<meta http-equiv="Expires" content="-1">
<meta http-equiv="cache-control" content="no-store">
<meta name='toast_position' content='bottom-center'>
<meta name="gridster" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
<meta name="gridster_disable" content="1">
<!--meta name="widget_base_width" content="110"-->
<meta name="widget_base_height" content="150">
<meta name="mobile-web-app-capable" content="yes">
<meta name="apple-mobile-web-app-capable" content="no">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="longpoll" content="1">
<meta name="debug" content="0">
<link rel="stylesheet" href="/fhem/tablet/lib/jquery.gridster.min.css" />
<link rel="stylesheet" href="/fhem/tablet/css/fhem-tablet-ui.css" />
<link rel="stylesheet" href="/fhem/tablet/lib/font-awesome.min.css" />
<link rel="stylesheet" href="/fhem/tablet/lib/openautomation.css" />
<link rel="stylesheet" href="/fhem/tablet/lib/jquery.toast.min.css" />
<link rel="stylesheet" href="/fhem/tablet/lib/powerange.min.css" />
<link rel="stylesheet" href="/fhem/tablet/css/fhem-tablet-ui-wdtimer.css" />
<link rel="stylesheet" href="/fhem/tablet/style.css">
<link rel="stylesheet" href="/fhem/tablet/css/fhem-table-user.css" />
<script type="text/javascript" src="/fhem/pgm2/jquery.min.js"></script>
<script type="text/javascript" src="/fhem/tablet/lib/jquery.knob.mod.min.js"></script>
<script type="text/javascript" src="/fhem/tablet/lib/jquery.toast.min.js"></script>
<script type="text/javascript" src="/fhem/tablet/lib/jquery.circlemenu.js"></script>
<script type="text/javascript" src="/fhem/tablet/lib/powerange.min.js"></script>
<script type="text/javascript" src="/fhem/tablet/lib/jquery.gridster.min.js"></script>
<script type="text/javascript" src="/fhem/tablet/lib/fa-multi-button.min.js"></script>
<script type="text/javascript" src="/fhem/tablet/js/fhem-tablet-ui.js"></script>
<style type="text/css">
td {
color: white;
}
</style>
</head>
<body>
<div class="gridster">
<ul>
<li data-row="1" data-col="1" data-sizex="5" data-sizey="3" class="bg-black">
<table>
<tr>
<td width=40%">
<div class="sheet bold top-align">
<div class="inline top right-space">
<div data-type="label" class="top-space bigger">Außen</div>
<div data-type="label" data-device="Proplanta" data-get="temperature" data-fix="1" data-limits='[-73,18,25]' data-colors='["cornflowerblue","green","firebrick"]'
data-unit="%B0C%0A" class="grande"></div>
<!--div class="">Luftfeuchtigkeit</div--><div class="large inline">Luftfeuchtigkeit:</div>
<div data-type="label" data-device="Wetter" data-get="humidity" data-limits='[0,40,70]' data-colors='["cornflowerblue","green","firebrick"]'
data-unit="%" class="big inline"></div>
<div data-type="label" class="top-space big">Innen</div>
<div data-type="label" data-device="Proplanta" data-get="temperature" data-fix="1" data-limits='[-73,20,23]' data-colors='["cornflowerblue","green","firebrick"]'
data-unit="%B0C%0A" class="tall"></div>
</div>
</td>
<td width=20%">
<div class="inline top">
<div data-type="weather" data-device="Wetter" data-get="condition" data-imageset="kleinklima" style="width:350px" class=""></div>
<div data-type="label" data-device="Wetter" data-get="condition" class="inline bigger"></div>
</div>
</td>
<td width=40%">
<div class="inline top left-space-1x bigger">
<div class="">Heute MIN/MAX</div>
<div data-type="label" data-device="Proplanta" data-get="fc0_tempMin" data-fix="1" data-limits='[-73,18,25]' data-colors='["cornflowerblue","green","firebrick"]'
data-unit="%B0C%0A" class="big inline"></div>/
<div data-type="label" data-device="Proplanta" data-get="fc0_tempMax" data-fix="1" data-limits='[-73,18,25]' data-colors='["cornflowerblue","green","firebrick"]'
data-unit="%B0C%0A" class="big inline"></div>
<div class="">Sonne</div>
<div data-type="label" data-device="Proplanta" data-get="fc2_sun" data-limits='[0,40,80]' data-colors='["firebrick","#aa6900","green"]' data-unit="%"
class="medium inline"></div>
<div class="">Regen</div>
<div data-type="label" data-device="Proplanta" data-get="fc0_chOfRainDay" data-unit="%" data-limits='[0,40,80]' data-colors='["green","#aa6900","firebrick"]'
class="medium inline"></div>
</div>
</td>
</tr>
</table>
<div class="inline sheet normal bold">
<div class="col-1-3">
<div data-type="label" class="cell top-space normal">MORGENS</div>
<div data-type="weather" data-device="Proplanta" data-get="fc0_weatherMorningIcon" data-imageset="kleinklima" class="inline" style="width:190px"></div>
<div class="inline big" style="text-align:center;vertical-align:bottom">
<div data-type="label" data-device="Proplanta" data-get="fc0_temp06" data-unit="%B0C%0A" class="bigger" data-limits='[-50,0]' data-colors='["#5858FA","white"]'></div>
</div>
</div>
<div class="col-1-3">
<div data-type="label" class="cell top-space normal">MITTAGS</div>
<div data-type="weather" data-device="Proplanta" data-get="fc0_weatherDayIcon" data-imageset="kleinklima" class="inline" style="width:190px"></div>
<div class="inline big" style="text-align:center;vertical-align:bottom">
<div data-type="label" data-device="Proplanta" data-get="fc0_temp12" data-unit="%B0C%0A" class="bigger" data-limits='[-50,0]' data-colors='["#5858FA","white"]'></div>
</div>
</div>
<div class="col-1-3">
<div data-type="label" class="cell top-space normal">ABENDS</div>
<div data-type="weather" data-device="Proplanta" data-get="fc0_weatherEveningIcon" data-imageset="kleinklima" class="inline" style="width:190px"></div>
<div class="inline big" style="text-align:center;vertical-align:bottom">
<div data-type="label" data-device="Proplanta" data-get="fc0_temp18" data-unit="%B0C%0A" class="bigger" data-limits='[-50,0]' data-colors='["#5858FA","white"]'></div>
</div>
</div>
</div>
<li data-row="2" data-col="1" data-sizex="5" data-sizey="1" class="bg-transparent">
<header><div data-type="label" class="inline bigger">MORGEN</div>
<div data-type="label" data-device="Proplanta" data-get="fc1_date" data-substitution="toDate().ddmmyyyy()" class="inline bigger">
</header>
<table>
<tr>
<td width="15%">
<div class="inline sheet large">
<div class="inline top">
<div data-type="weather" data-device="Proplanta" data-get="fc1_weatherDay" data-imageset="kleinklima" class="centered" style="width:150px;"></div>
</div>
</td>
<td width="28%">
<div class="inline big top bold">
<div class="medium inline">Temp:</div>
<div data-type="label" data-device="Proplanta" data-get="fc1_tempMin" data-fix="1" data-limits='[-73,18,25]' data-colors='["cornflowerblue","green","firebrick"]'
data-unit="%B0C%0A" class="big inline"></div>/
<div data-type="label" data-device="Proplanta" data-get="fc1_tempMax" data-fix="1" data-limits='[-73,18,25]' data-colors='["cornflowerblue","green","firebrick"]'
data-unit="%B0C%0A" class="big inline"></div>
<div>
<div class="medium top-space inline">Sonne:</div>
<div data-type="label" data-device="Proplanta" data-get="fc1_sun" data-limits='[0,40,80]' data-colors='["firebrick","#aa6900","green"]' data-unit="%" class="medium inline"></div>
<div>
<div class="medium inline">Regen:</div>
<div data-type="label" data-device="Proplanta" data-get="fc1_chOfRainDay" data-unit="%" data-limits='[0,40,80]' data-colors='["green","#aa6900","firebrick"]' class="medium inline"></div>
<div>
<div class="medium inline">UV:</div>
<div data-type="label" data-device="Proplanta" data-get="fc1_uv" data-unit="" data-limits="[0,4,8,11]" data-colors='["green","#aa6900","firebrick","red"]' class="medium inline"></div>
</div>
</td>
<td width="50%">
<div class="inline big bold">
<div class="sheet left-space">
<div class="col-1-3">
<div data-type="label" class="cell top-space tiny">morgens</div>
<div data-type="weather" data-device="Proplanta" data-get="fc1_weatherMorningIcon" data-imageset="kleinklima" class="inline" style="width:90px"></div>
<div class="inline" style="text-align:center;vertical-align:bottom">
<div data-type="label" data-device="Proplanta" data-get="fc1_temp06" data-unit="%B0C%0A" class="large" data-limits='[-50,0]' data-colors='["#a3a3fc","grey"]'></div>
</div>
</div>
<div class="col-1-3">
<div data-type="label" class="cell top-space tiny">mittags</div>
<div data-type="weather" data-device="Proplanta" data-get="fc1_weatherDayIcon" data-imageset="kleinklima" class="inline" style="width:90px"></div>
<div class="inline" style="text-align:center;vertical-align:bottom">
<div data-type="label" data-device="Proplanta" data-get="fc1_temp12" data-unit="%B0C%0A" class="large" data-limits='[-50,0]' data-colors='["#a3a3fc","grey"]'></div>
</div>
</div>
<div class="col-1-3">
<div data-type="label" class="cell top-space tiny">abends</div>
<div data-type="weather" data-device="Proplanta" data-get="fc1_weatherEveningIcon" data-imageset="kleinklima" class="inline" style="width:90px"></div>
<div class="inline" style="text-align:center;vertical-align:bottom">
<div data-type="label" data-device="Proplanta" data-get="fc1_temp18" data-unit="%B0C%0A" class="large" data-limits='[-50,0]' data-colors='["#a3a3fc","grey"]'></div>
</div>
</div>
</div>
</div>
</td>
</tr>
</table>
<li data-row="3" data-col="1" data-sizex="5" data-sizey="1" class="bg-transparent">
<header> <div data-type="label" data-device="Proplanta" data-get="fc2_date" data-substitution="toDate().eeee()+''" class="inline big"></div>
<div data-type="label" data-device="Proplanta" data-get="fc2_date" data-substitution="toDate().ddmmyyyy()" class="inline bigger">
</div>
</header>
<table>
<td width="15%">
<div class="sheet large">
<div class="inline top">
<div data-type="weather" data-device="Proplanta" data-get="fc2_weatherDay" data-imageset="kleinklima" class="centered" style="width:150px;"></div>
</div>
</td>
<td width="28%">
<div class="inline big top bold">
<div class="medium inline">Temp:</div>
<div data-type="label" data-device="Proplanta" data-get="fc2_tempMin" data-fix="1" data-limits='[-73,18,25]' data-colors='["cornflowerblue","green","firebrick"]'
data-unit="%B0C%0A" class="big inline"></div>/
<div data-type="label" data-device="Proplanta" data-get="fc2_tempMax" data-fix="1" data-limits='[-73,18,25]' data-colors='["cornflowerblue","green","firebrick"]'
data-unit="%B0C%0A" class="big inline"></div>
<div>
<div class="medium top-space inline">Sonne:</div>
<div data-type="label" data-device="Proplanta" data-get="fc2_sun" data-limits='[0,40,80]' data-colors='["firebrick","#aa6900","green"]' data-unit="%" class="medium inline"></div>
<div>
<div class="medium inline">Regen:</div>
<div data-type="label" data-device="Proplanta" data-get="fc2_chOfRainDay" data-unit="%" data-limits='[0,40,80]' data-colors='["green","#aa6900","firebrick"]' class="medium inline"></div>
<div>
<div class="medium inline">UV:</div>
<div data-type="label" data-device="Proplanta" data-get="fc2_uv" data-unit="" data-limits="[0,4,8,11]" data-colors='["green","#aa6900","firebrick","red"]' class="medium inline"></div>
</div>
</td>
<td width="50%">
<div class="inline big bold">
<div class="sheet left-space">
<div class="col-1-3">
<div data-type="label" class="cell top-space tiny">morgens</div>
<div data-type="weather" data-device="Proplanta" data-get="fc2_weatherMorningIcon" data-imageset="kleinklima" class="inline" style="width:90px"></div>
<div class="inline" style="text-align:center;vertical-align:bottom">
<div data-type="label" data-device="Proplanta" data-get="fc2_temp06" data-unit="%B0C%0A" class="large" data-limits='[-50,0]' data-colors='["#a3a3fc","grey"]'></div>
</div>
</div>
<div class="col-1-3">
<div data-type="label" class="cell top-space tiny">mittags</div>
<div data-type="weather" data-device="Proplanta" data-get="fc2_weatherDayIcon" data-imageset="kleinklima" class="inline" style="width:90px"></div>
<div class="inline" style="text-align:center;vertical-align:bottom">
<div data-type="label" data-device="Proplanta" data-get="fc2_temp12" data-unit="%B0C%0A" class="large" data-limits='[-50,0]' data-colors='["#a3a3fc","grey"]'></div>
</div>
</div>
<div class="col-1-3">
<div data-type="label" class="cell top-space tiny">abends</div>
<div data-type="weather" data-device="Proplanta" data-get="fc2_weatherEveningIcon" data-imageset="kleinklima" class="inline" style="width:90px"></div>
<div class="inline" style="text-align:center;vertical-align:bottom">
<div data-type="label" data-device="Proplanta" data-get="fc2_temp18" data-unit="%B0C%0A" class="large" data-limits='[-50,0]' data-colors='["#a3a3fc","grey"]'></div>
</div>
</div>
</div>
</div>
</td>
</tr>
</table>
<li data-row="4" data-col="1" data-sizex="5" data-sizey="1" class="bg-transparent">
<header> <div data-type="label" data-device="Proplanta" data-get="fc3_date" data-substitution="toDate().eeee()+''" class="inline big"></div>
<div data-type="label" data-device="Proplanta" data-get="fc3_date" data-substitution="toDate().ddmmyyyy()" class="inline bigger">
</div>
</header>
<table>
<td width="15%">
<div class="sheet large">
<div class="inline top">
<div data-type="weather" data-device="Proplanta" data-get="fc3_weatherDay" data-imageset="kleinklima" class="centered" style="width:150px;"></div>
</div>
</td>
<td width="28%">
<div class="inline big top bold">
<div class="medium inline">Temp:</div>
<div data-type="label" data-device="Proplanta" data-get="fc3_tempMin" data-fix="1" data-limits='[-73,18,25]' data-colors='["cornflowerblue","green","firebrick"]'
data-unit="%B0C%0A" class="big inline"></div>/
<div data-type="label" data-device="Proplanta" data-get="fc3_tempMax" data-fix="1" data-limits='[-73,18,25]' data-colors='["cornflowerblue","green","firebrick"]'
data-unit="%B0C%0A" class="big inline"></div>
<div>
<div class="medium top-space inline">Sonne:</div>
<div data-type="label" data-device="Proplanta" data-get="fc3_sun" data-limits='[0,40,80]' data-colors='["firebrick","#aa6900","green"]' data-unit="%" class="medium inline"></div>
<div>
<div class="medium inline">Regen:</div>
<div data-type="label" data-device="Proplanta" data-get="fc3_chOfRainDay" data-unit="%" data-limits='[0,40,80]' data-colors='["green","#aa6900","firebrick"]' class="medium inline"></div>
<div>
<div class="medium inline">UV:</div>
<div data-type="label" data-device="Proplanta" data-get="fc3_uv" data-unit="" data-limits="[0,4,8,11]" data-colors='["green","#aa6900","firebrick","red"]' class="medium inline"></div>
</div>
</td>
<td width="50%">
<div class="inline big bold">
<div class="sheet left-space">
<div class="col-1-3">
<div data-type="label" class="cell top-space tiny">morgens</div>
<div data-type="weather" data-device="Proplanta" data-get="fc3_weatherMorningIcon" data-imageset="kleinklima" class="inline" style="width:90px"></div>
<div class="inline" style="text-align:center;vertical-align:bottom">
<div data-type="label" data-device="Proplanta" data-get="fc3_temp06" data-unit="%B0C%0A" class="large" data-limits='[-50,0]' data-colors='["#a3a3fc","grey"]'></div>
</div>
</div>
<div class="col-1-3">
<div data-type="label" class="cell top-space tiny">mittags</div>
<div data-type="weather" data-device="Proplanta" data-get="fc3_weatherDayIcon" data-imageset="kleinklima" class="inline" style="width:90px"></div>
<div class="inline" style="text-align:center;vertical-align:bottom">
<div data-type="label" data-device="Proplanta" data-get="fc3_temp12" data-unit="%B0C%0A" class="large" data-limits='[-50,0]' data-colors='["#a3a3fc","grey"]'></div>
</div>
</div>
<div class="col-1-3">
<div data-type="label" class="cell top-space tiny">abends</div>
<div data-type="weather" data-device="Proplanta" data-get="fc3_weatherEveningIcon" data-imageset="kleinklima" class="inline" style="width:90px"></div>
<div class="inline" style="text-align:center;vertical-align:bottom">
<div data-type="label" data-device="Proplanta" data-get="fc3_temp18" data-unit="%B0C%0A" class="large" data-limits='[-50,0]' data-colors='["#a3a3fc","grey"]'></div>
</div>
</div>
</div>
</div>
</td>
</tr>
</table>
<li data-row="5" data-col="1" data-sizex="5" data-sizey="1" class="bg-transparent">
<header> <div data-type="label" data-device="Proplanta" data-get="fc4_date" data-substitution="toDate().eeee()+''" class="inline big"></div>
<div data-type="label" data-device="Proplanta" data-get="fc4_date" data-substitution="toDate().ddmmyyyy()" class="inline bigger">
</div>
</header>
<table>
<tr>
<td width="15%">
<div class="sheet large">
<div class="inline top">
<div data-type="weather" data-device="Proplanta" data-get="fc4_weatherDay" data-imageset="kleinklima" class="centered" style="width:150px;"></div>
</div>
</td>
<td width="28%">
<div class="inline big top bold">
<div class="medium inline">Temp:</div>
<div data-type="label" data-device="Proplanta" data-get="fc4_tempMin" data-fix="1" data-limits='[-73,18,25]' data-colors='["cornflowerblue","green","firebrick"]'
data-unit="%B0C%0A" class="big inline"></div>/
<div data-type="label" data-device="Proplanta" data-get="fc4_tempMax" data-fix="1" data-limits='[-73,18,25]' data-colors='["cornflowerblue","green","firebrick"]'
data-unit="%B0C%0A" class="big inline"></div>
<div>
<div class="medium top-space inline">Sonne:</div>
<div data-type="label" data-device="Proplanta" data-get="fc4_sun" data-limits='[0,40,80]' data-colors='["firebrick","#aa6900","green"]' data-unit="%" class="medium inline"></div>
<div>
<div class="medium inline">Regen:</div>
<div data-type="label" data-device="Proplanta" data-get="fc4_chOfRainDay" data-unit="%" data-limits='[0,40,80]' data-colors='["green","#aa6900","firebrick"]' class="medium inline"></div>
<div>
<div class="medium inline">UV:</div>
<div data-type="label" data-device="Proplanta" data-get="fc4_uv" data-unit="" data-limits="[0,4,8,11]" data-colors='["green","#aa6900","firebrick","red"]' class="medium inline"></div>
</div>
</td>
<td width="50%">
<div class="inline big bold">
<div class="sheet left-space">
<div class="col-1-3">
<div data-type="label" class="cell top-space tiny">morgens</div>
<div data-type="weather" data-device="Proplanta" data-get="fc4_weatherMorningIcon" data-imageset="kleinklima" class="inline" style="width:90px"></div>
<div class="inline" style="text-align:center;vertical-align:bottom">
<div data-type="label" data-device="Proplanta" data-get="fc4_temp06" data-unit="%B0C%0A" class="large" data-limits='[-50,0]' data-colors='["#a3a3fc","grey"]'></div>
</div>
</div>
<div class="col-1-3">
<div data-type="label" class="cell top-space tiny">mittags</div>
<div data-type="weather" data-device="Proplanta" data-get="fc4_weatherDayIcon" data-imageset="kleinklima" class="inline" style="width:90px"></div>
<div class="inline" style="text-align:center;vertical-align:bottom">
<div data-type="label" data-device="Proplanta" data-get="fc4_temp12" data-unit="%B0C%0A" class="large" data-limits='[-50,0]' data-colors='["#a3a3fc","grey"]'></div>
</div>
</div>
<div class="col-1-3">
<div data-type="label" class="cell top-space tiny">abends</div>
<div data-type="weather" data-device="Proplanta" data-get="fc4_weatherEveningIcon" data-imageset="kleinklima" class="inline" style="width:90px"></div>
<div class="inline" style="text-align:center;vertical-align:bottom">
<div data-type="label" data-device="Proplanta" data-get="fc4_temp18" data-unit="%B0C%0A" class="large" data-limits='[-50,0]' data-colors='["#a3a3fc","grey"]'></div>
</div>
</div>
</div>
</div>
</td>
</tr>
</table>
<li data-row="6" data-col="1" data-sizex="5" data-sizey="1" class="bg-transparent">
<header> <div data-type="label" data-device="Proplanta" data-get="fc5_date" data-substitution="toDate().eeee()+''" class="inline big"></div>
<div data-type="label" data-device="Proplanta" data-get="fc5_date" data-substitution="toDate().ddmmyyyy()" class="inline bigger">
</div>
</header>
<table>
<tr>
<td width="15%">
<div class="sheet large">
<div class="inline top">
<div data-type="weather" data-device="Proplanta" data-get="fc5_weatherDay" data-imageset="kleinklima" class="centered" style="width:150px;"></div>
</div>
</td>
<td width="28%">
<div class="inline big top bold">
<div class="medium inline">Temp:</div>
<div data-type="label" data-device="Proplanta" data-get="fc5_tempMin" data-fix="1" data-limits='[-73,18,25]' data-colors='["cornflowerblue","green","firebrick"]'
data-unit="%B0C%0A" class="big inline"></div>/
<div data-type="label" data-device="Proplanta" data-get="fc5_tempMax" data-fix="1" data-limits='[-73,18,25]' data-colors='["cornflowerblue","green","firebrick"]'
data-unit="%B0C%0A" class="big inline"></div>
<div>
<div class="medium top-space inline">Sonne:</div>
<div data-type="label" data-device="Proplanta" data-get="fc5_sun" data-limits='[0,40,80]' data-colors='["firebrick","#aa6900","green"]' data-unit="%" class="medium inline"></div>
<div>
<div class="medium inline">Regen:</div>
<div data-type="label" data-device="Proplanta" data-get="fc5_chOfRainDay" data-unit="%" data-limits='[0,40,80]' data-colors='["green","#aa6900","firebrick"]' class="medium inline"></div>
<div>
<div class="medium inline">UV:</div>
<div data-type="label" data-device="Proplanta" data-get="fc5_uv" data-unit="" data-limits="[0,4,8,11]" data-colors='["green","#aa6900","firebrick","red"]' class="medium inline"></div>
</div>
</td>
<td width="50%">
<div class="inline big bold">
<div class="sheet left-space">
<div class="col-1-3">
<div data-type="label" class="cell top-space tiny">morgens</div>
<div data-type="weather" data-device="Proplanta" data-get="fc5_weatherMorningIcon" data-imageset="kleinklima" class="inline" style="width:90px"></div>
<div class="inline" style="text-align:center;vertical-align:bottom">
<div data-type="label" data-device="Proplanta" data-get="fc5_temp06" data-unit="%B0C%0A" class="large" data-limits='[-50,0]' data-colors='["#a3a3fc","grey"]'></div>
</div>
</div>
<div class="col-1-3">
<div data-type="label" class="cell top-space tiny">mittags</div>
<div data-type="weather" data-device="Proplanta" data-get="fc5_weatherDayIcon" data-imageset="kleinklima" class="inline" style="width:90px"></div>
<div class="inline" style="text-align:center;vertical-align:bottom">
<div data-type="label" data-device="Proplanta" data-get="fc5_temp12" data-unit="%B0C%0A" class="large" data-limits='[-50,0]' data-colors='["#a3a3fc","grey"]'></div>
</div>
</div>
<div class="col-1-3">
<div data-type="label" class="cell top-space tiny">abends</div>
<div data-type="weather" data-device="Proplanta" data-get="fc5_weatherEveningIcon" data-imageset="kleinklima" class="inline" style="width:90px"></div>
<div class="inline" style="text-align:center;vertical-align:bottom">
<div data-type="label" data-device="Proplanta" data-get="fc5_temp18" data-unit="%B0C%0A" class="large" data-limits='[-50,0]' data-colors='["#a3a3fc","grey"]'></div>
</div>
</div>
</div>
</div>
</td>
</tr>
</table>
<li data-row="7" data-col="1" data-sizex="5" data-sizey="1" class="bg-transparent">
<header> <div data-type="label" data-device="Proplanta" data-get="fc6_date" data-substitution="toDate().eeee()+''" class="inline big"></div>
<div data-type="label" data-device="Proplanta" data-get="fc6_date" data-substitution="toDate().ddmmyyyy()" class="inline bigger">
</div>
</header>
<table>
<tr>
<td width="15%">
<div class="sheet large">
<div class="inline top">
<div data-type="weather" data-device="Proplanta" data-get="fc6_weatherDay" data-imageset="kleinklima" class="centered" style="width:150px;"></div>
</div>
</td>
<td width="28%">
<div class="inline big top bold">
<div class="medium inline">Temp:</div>
<div data-type="label" data-device="Proplanta" data-get="fc6_tempMin" data-fix="1" data-limits='[-73,18,25]' data-colors='["cornflowerblue","green","firebrick"]'
data-unit="%B0C%0A" class="big inline"></div>/
<div data-type="label" data-device="Proplanta" data-get="fc6_tempMax" data-fix="1" data-limits='[-73,18,25]' data-colors='["cornflowerblue","green","firebrick"]'
data-unit="%B0C%0A" class="big inline"></div>
<div>
<div class="medium top-space inline">Sonne:</div>
<div data-type="label" data-device="Proplanta" data-get="fc6_sun" data-limits='[0,40,80]' data-colors='["firebrick","#aa6900","green"]' data-unit="%" class="medium inline"></div>
<div>
<div class="medium inline">Regen:</div>
<div data-type="label" data-device="Proplanta" data-get="fc6_chOfRainDay" data-unit="%" data-limits='[0,40,80]' data-colors='["green","#aa6900","firebrick"]' class="medium inline"></div>
<div>
<div class="medium inline">UV:</div>
<div data-type="label" data-device="Proplanta" data-get="fc6_uv" data-unit="" data-limits="[0,4,8,11]" data-colors='["green","#aa6900","firebrick","red"]' class="medium inline"></div>
</div>
</td>
<td width="50%">
<div class="inline big bold">
<div class="sheet left-space">
<div class="col-1-3">
<div data-type="label" class="cell top-space tiny">morgens</div>
<div data-type="weather" data-device="Proplanta" data-get="fc6_weatherMorningIcon" data-imageset="kleinklima" class="inline" style="width:90px"></div>
<div class="inline" style="text-align:center;vertical-align:bottom">
<div data-type="label" data-device="Proplanta" data-get="fc6_temp06" data-unit="%B0C%0A" class="large" data-limits='[-50,0]' data-colors='["#a3a3fc","grey"]'></div>
</div>
</div>
<div class="col-1-3">
<div data-type="label" class="cell top-space tiny">mittags</div>
<div data-type="weather" data-device="Proplanta" data-get="fc6_weatherDayIcon" data-imageset="kleinklima" class="inline" style="width:90px"></div>
<div class="inline" style="text-align:center;vertical-align:bottom">
<div data-type="label" data-device="Proplanta" data-get="fc6_temp12" data-unit="%B0C%0A" class="large" data-limits='[-50,0]' data-colors='["#a3a3fc","grey"]'></div>
</div>
</div>
<div class="col-1-3">
<div data-type="label" class="cell top-space tiny">abends</div>
<div data-type="weather" data-device="Proplanta" data-get="fc6_weatherEveningIcon" data-imageset="kleinklima" class="inline" style="width:90px"></div>
<div class="inline" style="text-align:center;vertical-align:bottom">
<div data-type="label" data-device="Proplanta" data-get="fc6_temp18" data-unit="%B0C%0A" class="large" data-limits='[-50,0]' data-colors='["#a3a3fc","grey"]'></div>
</div>
</div>
</div>
</div>
</td>
</tr>
</table>
<li data-row="9" data-col="1" data-sizex="5" data-sizey="1" class="bg-black top-align large centered">
<header> <div data-type="label" class="inline big">POLLENFLUG</div> </header>
<div class="normal bold">
<div class="inline">
<div data-type="symbol" data-device="Pollenflug" data-get="Ambrosia" data-icons='["fa-forumbee","fa-forumbee","fa-forumbee"]'
data-get-on='["0","1","2","3"]' data-on-colors='["green","green","yellow","firebrick"]' data-off-color="#808080"
class="">
</div>
<div class="">Ambros
</div>
</div>
<div class="inline">
<div data-type="symbol" data-device="Pollenflugflug" data-get="Ahorn" data-icons='["fa-forumbee","fa-forumbee","fa-forumbee"]'
data-get-on='["0","1","2","3"]' data-on-colors='["green","green","yellow","firebrick"]' data-off-color="#808080"
class="">
</div>
<div class="">Ahorn
</div>
</div>
<div class="inline">
<div data-type="symbol" data-device="Pollenflug" data-get="Birke" data-icons='["fa-forumbee","fa-forumbee","fa-forumbee"]'
data-get-on='["0","1","2","3"]' data-on-colors='["green","green","yellow","firebrick"]' data-off-color="#808080"
class="">
</div>
<div class="">Birke
</div>
</div>
<div class="inline">
<div data-type="symbol" data-device="Pollenflug" data-get="Buche" data-icons='["fa-forumbee","fa-forumbee","fa-forumbee"]'
data-get-on='["0","1","2","3"]' data-on-colors='["green","green","yellow","firebrick"]' data-off-color="#808080"
class="">
</div>
<div class="">Buche
</div>
</div>
<div class="inline">
<div data-type="symbol" data-device="Pollenflug" data-get="Eiche" data-icons='["fa-forumbee","fa-forumbee","fa-forumbee"]'
data-get-on='["0","1","2","3"]' data-on-colors='["green","green","yellow","firebrick"]' data-off-color="#808080"
class="">
</div>
<div class="">Eiche
</div>
</div>
<div class="inline">
<div data-type="symbol" data-device="Pollenflug" data-get="Erle" data-icons='["fa-forumbee","fa-forumbee","fa-forumbee"]'
data-get-on='["0","1","2","3"]' data-on-colors='["green","green","yellow","firebrick"]' data-off-color="#808080"
class="">
</div>
<div class="">Erle
</div>
</div>
<div class="inline">
<div data-type="symbol" data-device="Pollenflug" data-get="Esche" data-icons='["fa-forumbee","fa-forumbee","fa-forumbee"]'
data-get-on='["0","1","2","3"]' data-on-colors='["green","green","yellow","firebrick"]' data-off-color="#808080"
class="">
</div>
<div class="">Esche
</div>
</div>
<div class="inline">
<div data-type="symbol" data-device="Pollenflug" data-get="Graeser" data-icons='["fa-forumbee","fa-forumbee","fa-forumbee"]'
data-get-on='["0","1","2","3"]' data-on-colors='["green","green","yellow","firebrick"]' data-off-color="#808080"
class="">
</div>
<div class="">Gräser
</div>
</div>
<div class="inline">
<div data-type="symbol" data-device="Pollenflug" data-get="Hasel" data-icons='["fa-forumbee","fa-forumbee","fa-forumbee"]'
data-off-color="#808080" data-get-on='["0","1","2","3"]' data-on-colors='["green","green","yellow","firebrick"]'
class="">
</div>
<div class="">Hasel
</div>
</div>
<div class="inline">
<div data-type="symbol" data-device="Pollenflug" data-get="Pappel" data-icons='["fa-forumbee","fa-forumbee","fa-forumbee"]'
data-get-on='["0","1","2","3"]' data-on-colors='["green","green","yellow","firebrick"]' data-off-color="#808080"
class="">
</div>
<div class="">Pappel
</div>
</div>
<div class="inline">
<div data-type="symbol" data-device="Pollenflug" data-get="Roggen" data-icons='["fa-forumbee","fa-forumbee","fa-forumbee"]'
data-get-on='["0","1","2","3"]' data-on-colors='["green","green","yellow","firebrick"]' data-off-color="#808080"
class="">
</div>
<div class="">Roggen
</div>
Also ich lege Höhe und Breite der Tabelle selbst immer im <table> Tag an, z.B.:
<table style="width:100%;height:90%" border="0">
Ich baue immer ein "border" mit ein, um zu sehen, ob die Tabelle so korrekt ist (1=Linien anzeigen)
Die Spalten definiere ich mit <colgroup> vor, z.B.:
<colgroup><col width="20%"><col width="15%"><col width="14%"><col width="16%"><col width="35%"></colgroup>
Lieber definiere ich dann ein paar Spalten mehr und fasse sie im <td> mit colspan="anzahl Spalten" zusammen, das macht es einfacher etwas einzufügen.
::) HI Danke! Aber irgendwie komme ich nicht über die erste Wolke hinaus... alles andere ist nicht sichtbar... Wo ist mein Fehler?
<li data-row="8" data-col="1" data-sizex="5" data-sizey="1" class="bg-transparent">
<header> <div data-type="label" data-device="Proplanta" data-get="fc6_date" data-substitution="toDate().eeee()+''" class="inline big white"></div>
<div data-type="label" data-device="Proplanta" data-get="fc6_date" data-substitution="toDate().ddmmyyyy()" class="inline bigger white">
</div>
</header>
<table style="width:100%;height:100%;" border="0">
<td colspan="3">
<colgroup>
<col width="15%">
<div class="inline sheet large">
<div class="inline top">
<div data-type="weather" data-device="Proplanta" data-get="fc1_weatherDay" data-imageset="kleinklima"
class="centered" style="width:150px;"></div>
</div>
<colgroup>
<col width="28%">
<div class="inline big top bold black">
<div class="medium inline">Temp:</div>
<div data-type="label" data-device="Proplanta" data-get="fc1_tempMin" data-fix="1" data-limits='[-73,18,25]' data-colors='["cornflowerblue","green","firebrick"]'
data-unit="%B0C%0A" class="big inline"></div>/
<div data-type="label" data-device="Proplanta" data-get="fc1_tempMax" data-fix="1" data-limits='[-73,18,25]' data-colors='["cornflowerblue","green","firebrick"]'
data-unit="%B0C%0A" class="big inline"></div>
<div>
<div class="medium top-space inline">Sonne:</div>
<div data-type="label" data-device="Proplanta" data-get="fc1_sun" data-limits='[0,40,80]' data-colors='["firebrick","#aa6900","green"]' data-unit="%" class="medium inline"></div>
<div>
<div class="medium inline">Regen:</div>
<div data-type="label" data-device="Proplanta" data-get="fc1_chOfRainDay" data-unit="%" data-limits='[0,40,80]' data-colors='["green","#aa6900","firebrick"]' class="medium inline"></div>
<div>
<div class="medium inline">UV:</div>
<div data-type="label" data-device="Proplanta" data-get="fc1_uv" data-unit="" data-limits="[0,4,8,11]" data-colors='["green","#aa6900","firebrick","red"]' class="medium inline"></div>
</div>
<colgroup>
<col width="57%">
<div class="inline big bold">
<div class="sheet left-space">
<div class="col-1-3">
<div data-type="label" class="cell top-space tiny">morgens</div>
<div data-type="weather" data-device="Proplanta" data-get="fc1_weatherMorningIcon" data-imageset="kleinklima" class="inline" style="width:90px"></div>
<div class="inline" style="text-align:center;vertical-align:bottom">
<div data-type="label" data-device="Proplanta" data-get="fc1_temp06" data-unit="%B0C%0A" class="large" data-limits='[-50,0]' data-colors='["#a3a3fc","grey"]'></div>
</div>
</div>
<div class="col-1-3">
<div data-type="label" class="cell top-space tiny">mittags</div>
<div data-type="weather" data-device="Proplanta" data-get="fc1_weatherDayIcon" data-imageset="kleinklima" class="inline" style="width:90px"></div>
<div class="inline" style="text-align:center;vertical-align:bottom">
<div data-type="label" data-device="Proplanta" data-get="fc1_temp12" data-unit="%B0C%0A" class="large" data-limits='[-50,0]' data-colors='["#a3a3fc","grey"]'></div>
</div>
</div>
<div class="col-1-3">
<div data-type="label" class="cell top-space tiny">abends</div>
<div data-type="weather" data-device="Proplanta" data-get="fc1_weatherEveningIcon" data-imageset="kleinklima" class="inline" style="width:90px"></div>
<div class="inline" style="text-align:center;vertical-align:bottom">
<div data-type="label" data-device="Proplanta" data-get="fc1_temp18" data-unit="%B0C%0A" class="large" data-limits='[-50,0]' data-colors='["#a3a3fc","grey"]'></div>
</div>
</div>
</div>
</div>
</colgroup>
</td>
</table>
die <colgroup> definiert die Spalten für die KOMPLETTE Tabelle und muss vor dem ersten <tr> stehen.
https://wiki.selfhtml.org/wiki/HTML/Tabellen/colgroup
So weit ich weiß, sollte <table> in HTML5 nur für echte Tabellendaten (alphanumerisch) verwendet werden. Die Verwendung von <table> für generelles Layout wird nicht empfohlen. Dafür gibt es sheet/row/cell und anderes.
Das Schachteln von <table> und <sheet> ist aus meiner Sicht so oder so problematisch.
Gruß,
Holger