Jahresrückblick 2025 – unser neuer Blogbeitrag ist online! ✨

[arteck]

@SKB du bist doch der css experte

[SKB]

@bertderkleine Dein CSS ist für den Text richtig. Dieser passt auch dann automatisch an den Hintergrund an.

[BertDerKleine]

@skb sagte in Fortschrittsbalken mit variabler Wert-Farbe:

@bertderkleine Dein CSS ist für den Text richtig. Dieser passt auch dann automatisch an den Hintergrund an.

Ok, kannst Du mir konkret sagen, welches Widget ich verwenden muss für den Text und in welches Feld ich dieses CSS dann reinschreiben muss, wenn ich es über einen Fortschrittsbalken schieben will?

Meine bisherigen Versuche mit einem Basic HTML Widget klappten so gar nicht, laut KI hat das potentiell irgendwas mit Z-Ebenen oder Hintergründen von VIS Widgets zu tun.

Daher suche ich nach etwas, das konkret und definitiv funktioniert.

[SKB]

@bertderkleine ich würde es mit einem Text Widget versuchen und dort dann die entsprechende CSS Klasse zuweisen.

[BertDerKleine]

@skb sagte in Fortschrittsbalken mit variabler Wert-Farbe:

@bertderkleine ich würde es mit einem Text Widget versuchen und dort dann die entsprechende CSS Klasse zuweisen.

Was für Dich klar ist, ist für mich leider nicht so klar, sorry.
Was konkret wäre ein geeignetes "Text Widget" und wo und wie "weise ich eine CSS Klasse zu"? Und welche?

[Ro75]

@bertderkleine Leider ist nicht zu erkennen, welche Visualisierung du nutzt Falls VIS 1, dann schau dir doch mal die Material Design Widgets an.

Ro75.

[SKB]

@bertderkleine Na, ein Widget, was Text beinhaltet. Egal welches. Das wirst Du finden.

Diesem Element weist du dann eine CSS Klasse zu mit den CSS Eigenschaften, die du bereits hast.

.meineKlasse {
color: #000;               /* Schwarz als Fallback */
mix-blend-mode: difference;  /* Invertiert automatisch den Hintergrund */
}

[BertDerKleine]

@skb
Ich habe es in VIS 1 versucht mit einem "basic - HTML" widget gegenüber einem "materialdesign - progress".
Eingetragen habe ich es so:

Das Ergebnis funktioniert aber nicht:

Beiden habe ich denselben z-index zugewiesen.
Ich nutze einen aktuellen Firefox.

[SKB]

@bertderkleine wenn das HTML die 87% sind, funktioniert es doch.

Das Schwarz ist ja nicht unter der 87%.

[BertDerKleine]

@skb
Wenn ich den Text voll auf den schwarzen Balken schiebe, bleibt der Text leider schwarz, was zeigt, dass es leider nicht funktioniert.

[SKB]

@bertderkleine Ich denke mal, dass es daran liegt, das der Balken ein Element ist und der Text auch. Somit wird kein Bezug hergestellt.

Die Farbe wird wohl nur bei direkt zusammenhängenden/verschachtelten Elementen adaptiert.