[bigfraggle]

Hallo zusammen.

Habe einen div-Container mit leichter Transparenz erstellt, um das Hintergrundbild durchscheinen zu lassen.

Code:

    filter: alpha(opacity=95);
    opacity: 0.95;

Soweit so gut, funktioniert damit bei jedem gängigen Browser.

Nun habe ich im besagten Container einzelne Bereiche (auch divs) definiert.
Diese erben jetzt aber (außer im IE) die Transparenz des Muttercontainers - was nicht erwünscht ist.

Ich habe mal versucht, für diese opacity auf 100 bzw. 1 zu setzen. Kein Erfolg.
Gibt es andere Möglichkeiten? Bin für jeden Tipp dankbar...

Gruß
bigfraggle

[querschlaeger]

Hallo und willkommen in der CSS-Welt. Ich bin an dieser Vererbung ebenfalls schon an die Grenzen gestoßen. Lösung für dich: Speichere eine PNG-Datei mit der Transparenz deiner Wahl ab und nimm diese als Hintergrundbild für den Container. Als Beispiel kannst du die angehängten Dateien verwenden (einmal weiß mit 80% Deckkraft und einmal schwarz mit 50% Deckkraft).

[bigfraggle]

Ja, scheint wirklich nicht zu gehen. Sowas aber auch...

Trotzdem danke für den Tipp mit der PNG-Tapete.

[modercol]

Das Problem bei deinem CSS ist, dass du mittels "opacity: XY;" den gesamten Div transparent machst, auch alle Elemente die darin sind. Außerdem ist diese Methode etwas unschön, weil wenn du nämlich nur den Hintergrund transparent machen möchtest, alles transparent ist.

CSS3 bietet hier etwas sehr schönes: RGBA-Farben, basierend auf RGB, nur eben mit Alphawerten, also Transparenz, so setzt du das ein:

Code:

background: rgba(255, 255, 255, 0.2)

background: rgba(R, G, B, A)
Du musst dein hexacode (z.B. #ff00ff) in RGB umwandeln, Grafikprogramme zeigen dir das aber direkt an.

[bigfraggle]

Funktioniert aber leider nicht bei allen gängigen Browsern...