opacity nicht vererben?

D34DL1NES

Erfahrenes Mitglied
hallo,

ganz vorweg ich bin ein absoluter css neuling, also wenn ich grundlegende fehler oder komische dinge mache weist mich einfach darauf hin.

so, nun zu meinem problem:
ich habe einen background (eigene id), darauf lege ich eine halbdurchsichtige weiße fläche (eigene id) darauf lege ich text (eigene id).

HTML:
#features_text_head{
	background-image: url(Images/InfoHeader.png);
	height:44px;
	width: 386px;
	margin-top: 10px;
	background-repeat: no-repeat;
	float: right;
}

#features_text_head_aplha{
	height: 40px;
	width: 200px;
	background-color: white;
	opacity: .45;
	margin: 2px;
}

#textheadfeature{
	font-family: sans-serif;
	font-size: 25px;
	color:black;
	padding-left: 10px;
	padding-bottom:5px;
}

html:
HTML:
<div id="features_text_head">
<div id="features_text_head_aplha">
<div id="textheadfeature">advative<br>
<a>www.advative.pl</a></div>
</div>
</div>

mit meiner aktuellen version wird der text "advative" sowie "www.advative.pl" ebenfalls halbdurchsichtig dargestellt, wie kann ich das verhindern bzw. die vererbung auflösen (opacity in der text id neu setzen funktioniert nicht)?

danke für die antworten schonmal :)
 
Zuletzt bearbeitet:
Wenn ich das richtig weiß, gehts leider nicht.
Die einzigste Möglichkeit die es in deinem Fall gibt wäre ein 45%ig transparentes Hintergrundbild im 2 DIV zu verwenden.
 
Hi,

die Vererbung der Transparenz lässt sich in dem verschachtelten Konstrukt in der Tat nur durch ein semitransparentes PNG-Hintergrundbild anstelle der opacity-Eigenschaft vermeiden.

Und achte in deinen Forenbeiträgen bitte auf unsere Netiquette bzgl. der erwünschten Groß- und Kleinschreibung - vielen Dank! :)

mfg Maik
 
Ok, danke schon einmal. Gibt es außerdem eine "opacity"-variante die auch z.B. mit IE oder anderen Browsern kompatibel ist (denn ich glaube die opacity Eigenschaft funktioniert nur mit FF)?
 
Moin,

für den IE gibt es aus dem Hause "Microsoft" filter:alpha(opacity=45) - alle übrigen aktuellen Browser folgen der CSS3-Spezifikation und interpretieren ebenso die opacity-Eigenschaft.

mfg Maik
 
Danke, muss ich dann einfach der id #features_text_head_aplha die Eigenschaft "filter:alpha(opacity=45)" hinzufügen damits auch im IE funktioniert oder beist sich das mit opacity?
 
Prinzipiell kannst du beide Angaben in dem Regelblock notieren, da keine von der "Gegenseite" interpretiert wird.

Wenn du Wert auf ein valides CSS für die standardkonformen Browser legst, übergibst du sie dem IE gesondert in seinem eigenen Stylesheet mittels des Conditional Comments, da dieser browsereigene Opacity-Filter kein Bestand der W3C-Spezifikation ist, und somit der CSS-Validitätsprüfung nicht standhält.

mfg Maik
 
Zurück