CSS: Problem mit Transparenz + Hintergrundfarbe..

Seite 1 von 1 - Forum: Coding Stuff auf overclockers.at

URL: https://www.overclockers.at/coding-stuff/css_problem_mit_transparenz_hintergrundfarbe_165841/page_1 - zur Vollversion wechseln!

semteX schrieb am 16.07.2006 um 23:46

Mein ziel war folgendes:

Boxen mit rand, die eine füllfarbe besitzen aber zu 70% durchsichtig sind WEIL im hintergrund eine Watermark ist...

Spooky hat mir ne lösung gebastelt, die funktioniert im FF super, im IE ist das feld wieder irgendwie ned sichtbar :/

praktisch anzusehen HIER:

http://www.team-steiner.at/CSSproblem.php

Wie kann ich das umgehen / lösen?

Vielen dank und gute nacht,
semteX

mat schrieb am 17.07.2006 um 01:47

opacity wird vom ie (und von einiges anderen browsern) nicht unterstützt.

du musst es mit einem bgimage machen. entweder per png (mit js-fix für ie) oder per gif mit einigen transparenten pixel innerhalb des bildes.

1tere methode ist natürlich schöner.

tomstig schrieb am 17.07.2006 um 05:40

Code:

div#menue{
	float: left;
	width: 200px; 
	filter:Alpha(opacity=70);	 
	-moz-opacity:0.7; 
	opacity:0.7; 
	background-color: #fff;
	color: #000;
	border: 1px solid #CCCCCA;
	border-left: none;
}

Ein Beispiel. Funktioniert in IE, FF, Opera.
Edit: Ich seh grad, dass dein CSS ähnlich dem meinigen ist. Probiert einfach mal background-color statt background.

Spikx schrieb am 17.07.2006 um 10:51

@tomstig & mat: Das Problem ist, dass #box durch die Anweisung

Code:

top:0px;
left:0px;
right:0px;
bottom:0px;

nicht auf die Größe von #container aufgezogen wird im IE (also dort nur 0 mal 0 px groß ist).
Hat absolut gar nichts mit background-color oder der opacity Anweisung zu tun, den dafür steht ja auch

Code:

filter:Alpha(opacity=70);

da. Filter sind ja IE spezifisch und funktionieren dort natürlich auch. Kann man überprüfen, indem man #box eine fixe Größe zuweist.

mat schrieb am 17.07.2006 um 10:54

:eek:

wieso funkts dann im FF?

btw: schön, dass opacity jetzt auch vom ie unterstützt wird, auch wenns wieder mal ein wenig "eigen" implementiert wurde

Spikx schrieb am 17.07.2006 um 10:57

Weil FF CSS besser versteht als der IE
Um divs im IE auf diese Weise auf die Größe des Elternelements aufzuziehen bentötigt man normalerweise den/einen IEfix. Hat in dem Fall aber auch nicht funktioniert, aber vielleicht lag's an etwas anderem.
I werd heut nochmal a einfaches Beispiel ausprobieren um des zu überprüfen.

//Filter existieren schon seit IE 4.0 btw.

semteX schrieb am 17.07.2006 um 13:06

das problem, das diesen workaround nötig machte war folgendes:

Ich wollte ne box mit folgenden eigenschaften:
Rahmen + Schrift = 100% deckkraft
Füllfarbe = 30% deckkraft.

eines der probleme war eben die "vererbung"...

wenn ich also ne <div id='meinebox'> mit 30% deckkraft aufgezogen hatte und dann ne <div id='100prozText'> machte, hatte der text dennoch nur 30% deckkraft

APDATE!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!EINSELF

http://team-steiner.at/CSSproblem.php

i hab jetzt den gatsch als png realisiert, jetzt fehlt nur noch da javascript ie haudichüberdieheuser fix... hat den zufällig wer? sonst werd ich mal google startn...

thx

NEXT UPDATE!

Gibts irgend nen IE PNG fix, mit dem ich den verdammten hintergrund auch repeaten kann?!

mat, wie funkt die GIF spielerei?
danke