✔ IE: Bild wird bei float: right; nicht angezeigt

[franz007]

Ich habe wieder einmal ein Problem mit dem IE:

Das Bild wird per float: right; am rechten Rand positioniert, zumindest im Firefox

Im IE wird zwar alles korrekt umflossen und das Bild kann man auch per Kontexmenü speichern aber es wird nicht angezeigt.

Wenn ich das float: right; rausnehme wird es auch wieder angezeigt.

http://www.franz007.at/about_me1.htm

 

[Biergamasda]

warum setzt du ins div ein img tag und gibst dem div nicht einfach ein Hintergrundbild, bzw wieso lässt du nicht einfach das div weg und floatest das bild rechts?
währen zwei möglichkeiten, die meines Wissens funktionieren sollten


nebenbei - so wie ich das sehe hast du die klasse img_comment nur einmal verwendet, demnach könntest du das float:right genausogut im css file in der Klassendefinition unterbringen - steigert meines Erachtens die Lesbarkeit

hoffe ich hab dir damit etwas geholfen

lg

 

[franz007]

warum setzt du ins div ein img tag und gibst dem div nicht einfach ein Hintergrundbild,

Das hat den einfachen Grund dass ich den darunterstehenden Text "franz007 persönlich" gerne im <div> hätte, es soll also eine Art Beschriftung für das Bild sein die direkt drunter steht.

bzw wieso lässt du nicht einfach das div weg und floatest das bild rechts?

Das habe ich auch schon versucht und jetzt auch unter

http://www.franz007.at/about_me2.htm

online gestellt. Es funktioniert leider auch nicht (keine Ahnung wiso)

nebenbei - so wie ich das sehe hast du die klasse img_comment nur einmal verwendet, demnach könntest du das float:right genausogut im css file in der Klassendefinition unterbringen - steigert meines Erachtens die Lesbarkeit

Die Lesbarkeit würde sicher gesteigert aber ich habe versucht die Klasse so allgemein wie möglich zu halten.

Das heißt dass es ja auch einmal links gefloated werden könnte, obwohl ich es ja trotzdem in der .css definieren könnte da ja die direkt per style="" definierte Angabe die höhere Priorität hat.



Leider weiß ich jetzt immer noch nicht wiso das Bild nicht angezeigt wird (es ist ja vorhanden (siehe Kontexmenü) aber danke für deine Antwort

 

[Maik]

Der IE benötigt in deinem CSS-Modell für das DIV.img_comment eine Angabe zur Schichtposition z-index:

div.img_comment{
        background-color: #FFFFFF;
        border: 1px #000000 solid;
        text-align: center;
        vertical-align: bottom;
        }

* html div.img_comment {  /* Für IE */
        position: relative;
        z-index: 2;
}

 

[franz007]

.imgcomment{
	position: relative;
	background-color: #FFFFFF;
	border: 1px #000000 solid;
	text-align: center;
}
.imgcomment img{
	border-style: none;
}

Mit nur position: relative; funktioniert es auch. Sogar ohne IE *-hack.

Zum Thema *-hack darf ich euch allen folgenden Artikel empfehlen

http://www.thestyleworks.de/tut-art/ie7.shtml

wie hier beschrieben wird der *-hack im IE 7 nicht mehr möglich sein.

Vielen dank, für den Tipp mit der position