kleinwoelfchen: CSS Infobox

Beitrag lesen

hallo,

Ich habe das Beispiel in meiner Webseite eingebaut und ein klein wenig angepaßt (Position und Größe).

Du hast etwas übersehen. Auch das von dir angegebene Beispiel funktioniert im IE6 nicht. Aber Beispiel2 funktioniert. Schau dir genau an, worin der Trick liegt, mit dem man diesen Hover-Effekt auch für IE6 nutzbar machen kann.

Grüße aus Berlin

Christoph S.

Hallo Christoph,

das Beispiel funktionierte bei mir mit beiden Browsern, da ich den IE7 aufgespielt habe. Mit 6 funktioniert es tatsächlich nicht. Trotzalledem klappte es auf meiner Seite trotz IE7 nicht ... das irritierte mich eben.

Leider bin ich seit 2002 oder länger nichtmehr am "basteln" gewesen und deswegen ist css und co alles noch relatives Neuland für mich.

Hier ist der Code (hätte ich auch in den ersten Post packen können *schäm*)

<style type="text/css">
<!--
img {
border:none;
}

#box{
height:96px;
width:128px;

border:1px solid black;
font:bold 14px verdana, sans-serif;}

#box div{display:none;}

#box:hover div{
display:block;
width:320px;
position:fixed;top:150px;right:20px;
border:1px dashed #FFEAC6;
padding:15px;}
-->
</style>

und hier dann entsprechend der Rest ...

<div id="box"><a href="pic/bilder/a1wurf/01_1.jpg" target="_blank" ><img src="pic/bilder/a1wurf/01_3.jpg" width="128" height="96" alt="Balou&Emily"></a>
 <div>
 <p><strong>Balou vs. Telefon</strong></p>
 <p><img src="pic/bilder/a1wurf/01_2.jpg" width="320" height="240" alt="Balou vs. Telefon"></p>
 <p>Text</p>
 </div>
</div>

Dann werde ich wohl Beispiel 2 mal genauer unter die "Lupe" nehmen und damit mein Glück versuchen.