[Css] ist Firefox ein bischen dumm

meisteralex · 4. April 2006

Hi Leute, ruft mal forlgendes HTML in eurem Firefox auf

HTML:

<a href="#" style="background:black;"><img height=33 width=33></a>

Wie ihr seht, wird das Bild, welches ja komplett verlinkt ist, nicht ganz geschwärtzt, sondern nur zur Hälfte ?? Im IE funktioniert das einwandfrei.
Woran liegt das ?
Sinn des ganzen ist, das ich Transparente gifs habe bei denen ich mit a:hover die Hintergrundfarbe ändern will

Damokles · 4. April 2006

Also bei mir ist der Hintergrund von dem kleinen Bild komplett schwarz.

-=TeuTaTes=- · 4. April 2006

Seltsam! Beim IE gehts. Opera macht ca. 66% der fläche Schwarz und Firefox ca. 50%!!
ich denke aber mal nicht das dass ein fehler bein interpretieren des codes ist, sondern es leigt ganz einfach daran, dass kein Bild in den IMG tag angegeben ist.

meisteralex · 4. April 2006

falsch, lag an meiner faulheit ein bild hochzuladen.
hab ja geschrieben, dass ich es für transparente gifs brauche (sonst würde man den hintergrund ja net sehen)
aber ob mit oder ohne bild, es gibt dieses ergebnis .

noch jemand ne idee ?

cR@zY.EnGi.GeR · 4. April 2006

Wieso machst du das mit nem Bild?
Nimm doch einfach nen DIV-Container.

meisteralex · 4. April 2006

*g* darauf wollte ich gerade verzichten
nehme ich divs, brauh ich floats um sie nebeneinander aufreihen zu können, hierdurch tauschen wieder x andere probleme auf

syntec · 4. April 2006

Ok, nur eine Idee - habs nicht ausprobiert

Dem A ein Hintergrundbild mit einem schwarzen Gif unterjubeln (ein paar Pixel schwarz, 1 bit Farbtiefe)

<a href="" style="background-image: url(schwarz.gif);">

Ansonsten vielleicht den ganzen Bereich mit einer schwarzen Farbe versehen und andere Grafiken drüberkleben die dann wiederrum das schwarz abdecken!?

cR@zY.EnGi.GeR · 4. April 2006

Also ich hab mal nen Editor programmiert, mit dem man die Text- und Hintergrundfarben ändern konnte und da konnte man die Farben nicht nur per RGB und Hexadezimalcode eingeben, sondern auch die Farbe per mouseover auswählen. Dafür hatte ich in mehreren Schleifen mehrere Hundert DIV-Container erstellt, wobei jeder ne andere Hintergrundfarbe hatte. Und die Hintergrundfarbe der DIV-Container für die Vorschau der ausgewählten Hintergrundfarbe hatten sich dann per mouseover geändert.

Ich weiß ja nicht, was du vorhast, aber das sollte mit DIV-Container problemlos möglich sein.
Mit Bildern würde ich sowas nicht machen, man kann die ja auch ausschalten oder wenn die Leitung gerade sehr belastet ist, kann das Bild eventuell nicht geladen und angezeigt werden.

syntec · 4. April 2006

Ok, so klappt es auch nicht

Dachte, es könnte vielleicht an der line-height liegen, dem ist aber auch nicht so. Warum bastelst Du also nicht eine einfache Tabelle mit den notwenigen Spalten wenn Dir das mit dem DIV nicht gefällt?

Loopo · 4. April 2006

wenn da ohnehin nur ein Bild reinkommt, mach doch gleich das Bild mit schwarzen Hintergrund

meisteralex · 4. April 2006

das problem ist, das ich mein design variabel halten will und wenn ich mal einen andere hintergrundfarbe haben will ist das doof, das ich immer die bilder ändern muss.

wie änder ich denn beim div die hintergrundfarbei mit hilfe von a:hover ???

bin gerade mit opera drinne und bei ihm ist das gleich problem da ?
vielleicht doch eine konforme interpretation ? nur warum ?

Bitte benutze in Zukunft den "Ändern" Button, Doppelposts sind nicht nur überflüssig, sondern auch gegen die Forenregeln.

DerEineDa · 6. April 2006

PHP:

<a href="#"><img style="background:black;" height=33 width=33></a>

..klappt aber bestens..

edit: achne, du willst das ja als hover... und soweit ich weiß kann der IE :hover nur bei Links.

edit2:

Also im IE7 und Firefox klappt

Code:

<html>
<head>
<style>
img.lalala:hover { background-color:black; }
</style>
</head>
<body>
<a href="#"><img class="lalala" height=33 width=33></a></body>
</html>

bestens, ich meine mich aber zu erinnern, dass der IE6 damit Probleme hatte. Das kann ich aber leider nicht testen.

cR@zY.EnGi.GeR · 6. April 2006

Machs doch einfach so:

Code:

<html>
<head>
<style>
.box
{
	height:33px;
	width:33px;
	border:1px solid black;
	float:left;
}
div.box:hover
{
	background-color:black;
}
</style>
</head>
<body>
<div class="box"></div>
<div class="box"></div>
</body>
</html>

DerEineDa · 6. April 2006

Ich kann es gerade wie gesagt nicht testen, aber "div:hover" wird doch vom IE6 nicht unterstützt, oder?

cR@zY.EnGi.GeR · 7. April 2006

Der IE6 kanns leider net, aber der IE7.

Dann musst dus halt folgendermaßen lösen:

Code:

<html>
<head>
<style>
.box
{
	height:33px;
	width:33px;
	border:1px solid black;
	float:left;
}
</style>
</head>
<body>
<script typ="text/JavaScript">
document.onmouseover = mouseOver;
document.onmouseout = mouseOut;

function mouseOver(e)
{
	if (window.event)
		var mouseEvent = window.event.srcElement;
	else if (e)
		var mouseEvent = e.target;
	if (mouseEvent.className == "box")
		mouseEvent.style.backgroundColor = "black";
}

function mouseOut(e)
{
	if (window.event)
		var mouseEvent = window.event.srcElement;
	else if (e)
		var mouseEvent = e.target;
	if (mouseEvent.className == "box")
		mouseEvent.style.backgroundColor = "white";
}
</script>
<div class="box"></div>
<div class="box"></div>
</body>
</html>

Suche

[Css] ist Firefox ein bischen dumm

meisteralex

Lieutenant

Damokles

Commander

-=TeuTaTes=-

Gast

meisteralex

Lieutenant

cR@zY.EnGi.GeR

Commander

meisteralex

Lieutenant

syntec

Lt. Commander

cR@zY.EnGi.GeR

Commander

syntec

Lt. Commander

Loopo

Admiral

meisteralex

Lieutenant

DerEineDa

Lieutenant

cR@zY.EnGi.GeR

Commander

DerEineDa

Lieutenant

cR@zY.EnGi.GeR

Commander

Ähnliche Themen