Archiv der Kategorie: HTML | CSS

Resizing iFrame

Folgende Funktion passt ein iFrame immer an die Größe der umliegenden Seite an:

Funktioniert im IE6/8, Firefox 3/4

Links mit Bildern durch CSS

Ich stand gerade vor dem Problem, das jeder Link mit einem kleinen Pfeil ausgestattet werden sollte. Im Ursprungszustand soll dieser Pfeil grau sein und beim Hover-Zustand weiß:
Links mit Grafik
Da ich jetzt nicht hinter jeden Link noch ein Bild einfügen wollte musste eine andere Lösung her und zwar wollte ich das ganze mit CSS lösen. Nach ein wenig Frickelei war es dann geschafft:
a:link { color:#7f7f7f; text-decoration:none; background-image: url(../img/arrow-grey.gif); background-repeat: no-repeat; background-position:100% 54%; margin-right:10px; padding-right: 10px; } a:visited { color:#7f7f7f; text-decoration:none; background-image: url(../img/arrow-grey.gif); background-repeat: no-repeat; background-position:100% 54%; margin-right:10px; padding-right: 10px; } a:hover { color:#FFFFFF; text-decoration:none; background-image: url(../img/arrow.gif); background-repeat: no-repeat; background-position:100% 54%; margin-right:10px; padding-right: 10px; }
Hier noch die beiden Grafiken zum nachbauen:
Pfeil weißPfeil grau