Hallo zusammen,
vermutlich stehe ich nur auf dem Schlauch, aber ...
Ich will ein Icon aus der weather-icon-Reihe als Symbol für einen Lagetab-Button verwenden. Das Icon wird aber nicht zentriert im Buttonkreis dargestellt, sondern nach oben verschoben. Das bekomme ich einfach nicht in die Mitte gerückt:
Die HTML sieht folgendermaßen aus:
<html>
<body>
<div class="sheet">
<div class="row">
<div class="cell top-align">
<div data-type="clock" data-format="l" class="large bold"></div>
<div data-type="clock" data-format="j. F Y" class="large bold"></div>
<div data-type="clock" data-format="H:i" class="tall bold"></div>
<div data-type="pagetab" data-url="/fhem/tablet/index.html" data-icon="fa-home" class="cell big top-space-3x"></div>
<div data-type="label" class="darker top-narrow">Übersicht</div>
<div data-type="pagetab" data-url="/fhem/tablet/index.html" data-icon="fa-fire" class="cell big top-space-3x"></div>
<div data-type="label" class="darker top-narrow">Heizung</div>
<div data-type="pagetab" data-url="/fhem/tablet/index.html" data-icon="wi wi-strong-wind" class="cell big top-space-3x"></div>
<div data-type="label" class="darker top-narrow">Lüftung</div>
<div data-type="pagetab" data-url="/fhem/tablet/index.html" data-icon="fa-cloud" class="cell big top-space-3x"></div>
<div data-type="label" class="darker top-narrow">Wetter</div>
<div data-type="pagetab" data-url="/fhem/tablet/index.html" data-icon="fa-bar-chart" class="cell big top-space-3x"></div>
<div data-type="label" class="darker top-narrow">Statistik</div>
</div>
</div>
</div>
</body>
</html>
Es geht um die Zeile:
<div data-type="pagetab" data-url="/fhem/tablet/index.html" data-icon="wi wi-strong-wind" class="cell big top-space-3x"></div>
Ein Bildschirmfoto habe ich angehängt.
Schon mal vielen Dank für eure Hilfe.
Yazo
Wenn man das line-height:1; aus der weather-icons.min.css entfernt, passt es.
Ich checke das noch, ob das Nebenwirkungen hat, ansonsten lade ich es gleich hoch.
Super, jetzt ist das Icon sauber zentriert.
Vielen Dank für die schnelle Hilfe!!
Yano