Transparenz wirkt sich auf Kind-Elemente aus

Einklappen
X
 
  • Filter
  • Zeit
  • Anzeigen
Alles löschen
neue Beiträge

  • Transparenz wirkt sich auf Kind-Elemente aus

    Hallo!

    Ich habe einem DIV mit einer Breite und Höhe von 100% über CSS einen Transparenz-Effekt verpasst. Innerhalb dieses DIV befindet sich ein weiteres DIV, das jedoch nicht transparent sein soll. Daher habe ich den Transparenz-Wert für dieses auf 1.00 gesetzt. Leider ist es aber so, dass dessen Werte zwar durchaus angewandt werden, jedoch kann die Transparenz damit nicht ganz abgeschaltet werden.

    Kann sich jemand erklären, woran dies liegen könnte und wie sich dies vielleicht lösen ließe?

    MfG
    Pascal
    Angehängte Dateien
    Interessantes aus den Themenbereichen Computer, Internet und Programmierung unter
    http://www.it-blog.net

  • #2
    Hallo Pascal,

    die Transparenz eines Elements gilt für dieses Element und alle seine Kinder inklusive Textknoten. Daran lässt sich nichts ändern und das entspricht auch dem Verhalten, wie man es auch von SVG kennt.

    Lösen lässt sich das Problem nur durch absolute Positionierung eines opaken Containers, der kein Nachfahre des (semi)transparenten sein darf, und idealerweise ein nachfolgendes Geschwisterelement ist (nextSibling).

    Gruß,

    Amica
    [COLOR="DarkSlateGray"]Hast du die [COLOR="DarkSlateGray"]Grundlagen zur Fehlersuche[/color] gelesen? Hast du Code-Tags benutzt?
    Hast du als URL oder Domain-Beispiele example.com, example.net oder example.org benutzt?
    Super, danke!
    [/COLOR]

    Kommentar


    • #3
      Hallo Amica!

      Danke für die Info. Ich habe nun aber noch eine andere Lösung gefunden, die - zumindest in meinem Fall - einfacher und besser ist. Dazu habe ich für den Transparenz-Effekt eine PNG-Grafik mit 70% Alpha-Transparenz als Hintergrund verwendet. Dadurch sind die CSS-Angaben für die Transparenz nicht mehr erforderlich und es funktioniert so, wie ich es möchte.

      MfG
      Pascal
      Interessantes aus den Themenbereichen Computer, Internet und Programmierung unter
      http://www.it-blog.net

      Kommentar


      • #4
        Jep, das geht natürlich auch, wird aber im IE 6 und drunter opak angezeigt, obwohl das in diesem Fall sicher auh verkraftbar ist.
        [COLOR="DarkSlateGray"]Hast du die [COLOR="DarkSlateGray"]Grundlagen zur Fehlersuche[/color] gelesen? Hast du Code-Tags benutzt?
        Hast du als URL oder Domain-Beispiele example.com, example.net oder example.org benutzt?
        Super, danke!
        [/COLOR]

        Kommentar


        • #5
          Über derart veraltete Browser mache ich mich schon lange keine Gedanken mehr. Daher ist es mir auch relativ egal, wie es in diesen dargestellt wird.
          Interessantes aus den Themenbereichen Computer, Internet und Programmierung unter
          http://www.it-blog.net

          Kommentar


          • #6
            Zitat von AmicaNoctis Beitrag anzeigen
            Jep, das geht natürlich auch, wird aber im IE 6 und drunter opak angezeigt, obwohl das in diesem Fall sicher auh verkraftbar ist.
            Wobei sich hier auch die Frage stellt, ob der IE<=6 überhaupt Transparenzen im CSS versteht... ;-)
            INFO: Erst suchen, dann posten![color=red] | [/color]MANUAL(s): PHP | MySQL | HTML/JS/CSS[color=red] | [/color]NICE: GNOME Do | TESTS: Gästebuch[color=red] | [/color]IM: Jabber.org |


            Kommentar


            • #7
              Zitat von Abraxax Beitrag anzeigen
              Wobei sich hier auch die Frage stellt, ob der IE<=6 überhaupt Transparenzen im CSS versteht... ;-)
              Manchmal erkennt man halt das offensichtlichste nicht.
              [COLOR="DarkSlateGray"]Hast du die [COLOR="DarkSlateGray"]Grundlagen zur Fehlersuche[/color] gelesen? Hast du Code-Tags benutzt?
              Hast du als URL oder Domain-Beispiele example.com, example.net oder example.org benutzt?
              Super, danke!
              [/COLOR]

              Kommentar


              • #8
                Zitat von Abraxax Beitrag anzeigen
                Wobei sich hier auch die Frage stellt, ob der IE<=6 überhaupt Transparenzen im CSS versteht... ;-)
                Zumindest filter:Alpha() kennt er schon seit 5.5.
                I don't believe in rebirth. Actually, I never did in my whole lives.

                Kommentar


                • #9
                  Zitat von pascaluhlmann Beitrag anzeigen
                  Über derart veraltete Browser mache ich mich schon lange keine Gedanken mehr. Daher ist es mir auch relativ egal, wie es in diesen dargestellt wird.
                  Lässt sich aber für background-images die keine extra CSS Eigenschaften benötigen wie Positionierung etc. recht einfach realisieren:

                  Wie kann man PNG-Alphatransparenz im IE nutzen? - jeenaparadies.net

                  Mit etwas getrickste sogar für img-tags.

                  Kommentar


                  • #10
                    Zitat von Caine Luveno Beitrag anzeigen
                    Lässt sich aber für background-images die keine extra CSS Eigenschaften benötigen wie Positionierung etc. recht einfach realisieren:
                    Was dann aber teilweise wieder andere, graviernde Nachteile mit sich bringen kann (Nicht-Nutzbarkeit von Links bspw.).
                    I don't believe in rebirth. Actually, I never did in my whole lives.

                    Kommentar

                    Lädt...
                    X