FHEM Forum

FHEM => Frontends => FLOORPLAN => Thema gestartet von: Bubbles71 am 19 Dezember 2020, 16:55:16

Titel: [gelöst] Fixierung von Spaltenbreiten in ReadingsGroup / Floorplan
Beitrag von: Bubbles71 am 19 Dezember 2020, 16:55:16
Hallo,

ich habe aktuell das Problem, dass Spalten einer ReadingsGroup, die relativ weit rechts positioniert ist, verkleinert werden. In der CSS habe ich die Spaltenbreite mit !important eigentlich fixiert.

Auf dem PC ist alles OK. Siehe Bild 1. Auf dem Tablet werden die Spalten aber gestaucht (siehe Bild 2 - simuliert über Verkleinerung des Browser Fensters am PC).
Die Topzeile wird auf dem Tablet komplett wie bei Bild 1 angezeigt, nur eben die Spalten der Abfall Übersicht werden gestaucht.

Wie kann ich diese dynamische Änderung der Spaltenbreite ausschalten / überschreiben?

Vielen Dank,

Roland



Titel: Antw:Fixierung von Spaltenbreiten in ReadingsGroup / Floorplan
Beitrag von: Bubbles71 am 23 Dezember 2020, 13:01:30
So, Lösung selber gefunden  ;D

Die Tabelle passt sich an die oberste Zeile an. In meinem Fall ist das die Kopfzeile der ReadingsGroup. Diese muss in der CSS der Floorplan Seite auf den gewünschten Wert gesetzt werden und das Tabellen Layout fixiert werden. Ob "!important" notwendig ist, weiß ich nicht. Aber es stört auch nicht.

width:130px !important; table-layout: fixed !important;}    <= Hier wird die Kopfzeile auf eine feste Breite gesetzt und das Tabellenlayout fixiert
Die komplette CSS Definition der RG sieht dann in meinem Fall so aus:

#rg_myAbfall_fp .devType {
        background-image: url('../images/lcars/rg_tb2.svg'),url('../images/lcars/rg_tb2.svg');
background-size: 100% 3px;
background-position: top,bottom; background-repeat: no-repeat; opacity: 1; color: var(--standard); height:32px;
font-size: 30px; font-family:Dense; text-align:right; padding-top:6px; padding-right: 20px;
border-radius:2px; border:0px solid #A0CAEC; font-weight: bold;
width:130px !important; table-layout: fixed !important;}

#readingsGroup-rg_myAbfall_fp td:nth-of-type(1)
{width:80px !important; height:15px; background-image:url(/fhem/images/lcars/lc_schild5.svg);
background-repeat: no-repeat;
background-position: center;
text-align:right; padding-top:8px; padding-right:15px;  }
#readingsGroup-rg_myAbfall_fp td:nth-of-type(2)
{width:30px; height:30px; table-layout: fixed;}

LG,

Roland