[gelöst] Fixierung von Spaltenbreiten in ReadingsGroup / Floorplan

Begonnen von Bubbles71, 19 Dezember 2020, 16:55:16

Vorheriges Thema - Nächstes Thema

Bubbles71

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




Bubbles71

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