IE will mal wieder nich
Canio
- browser
Hallo,ich hoffe ihr könnt mir helfen.
Also, ich möchte als Buttons auf meiner Seite Grafiken verwendet. Und zwar eine für den normalen Zustand, die andere für einen Rollover-Effekt. Fährt die Maus über die Grafik, erscheint die andere (Logo!).
Der untenstehende Code funzt prima, aber leider nur bei Firefox, nicht im IE. Letzterer zeigt mir erst gar nix an.
Der Code ist leicht zu lesen, würd mich sehr freuen über einen Lösungsvorschlag (ohne Javascript versteht sich).
HTML-Code:
...
<div id="home-btn"><a href=#></a></div>
...
CSS-Code:
...
#home-btn{
position:absolute;
left:29px;
top:106px;
width:59px;
height:24px;
z-index:5;
}
#home-btn a{
background-image: url(bilder/button_home.gif);
background-repeat: no-repeat;
padding-left: 59px;
padding-bottom: 12px;
}
#home-btn a:hover{
background-image: url(bilder/button_home_ro.gif);
background-repeat: no-repeat;
}
...
Hallo
Hallo,ich hoffe ihr könnt mir helfen.
Also, ich möchte als Buttons auf meiner Seite Grafiken verwendet. Und zwar eine für den normalen Zustand, die andere für einen Rollover-Effekt. Fährt die Maus über die Grafik, erscheint die andere (Logo!).
HTML-Code:
...
<div id="home-btn"><a href=#></a></div>
...CSS-Code:
...
#home-btn{
position:absolute;
left:29px;
top:106px;
width:59px;
height:24px;
z-index:5;
}
#home-btn a{
background-image: url(bilder/button_home.gif);
background-repeat: no-repeat;
padding-left: 59px;
padding-bottom: 12px;
}
#home-btn a:hover{
background-image: url(bilder/button_home_ro.gif);
background-repeat: no-repeat;
}
Der Link braucht gewisse Ausmaße, also width
und height
. Damit diese Angaben für ein Inlineelement, welches <a>
ist, umgesetzt werden, muss es via display:block;
zum Blockelement gemacht werden.
Das sollte alles sein.
Tschö, Auge
Stimmt genau, das ist es. Vielen Dank dafür!
Das padding war also nur Gestümper. So hab läuft's dann überall:
#home-btn a{
display:block;
background-image: url(bilder/button_home.gif);
background-repeat: no-repeat;
width:59px;
height:24px;
}