hover Rahmen nicht um Bild, sondern im Bild

[fabb]

Ashshaamad'd'a!

Ich möchte gern, dass der Rahmen, der erscheint, wenn ich mit der Maus über mein Icon fahre,

a:hover {
  border: thick white solid;
}

das Icon nicht umschließt und es damit vergrößert, sondern er soll im Icon erscheinen, sodass das Bild insgesamt nicht größer wird.

Wie Steel ganz richtig geschrieben hat, ist der Rahmen immer außen – der Effekt muß also irgendwie anders getrickst werden. Zwei Ideen (alternativ zu der von Steel):

• Eventuell kannst Du die Bilder mit clip zurechtschneiden – setzt aber absolute Positionierung voraus.
• Oder: Erstelle zusätzlich zu den Icons, die als img-Elemente vorliegen, solche, in denen der Rahmen schon eingebaut ist und verwende diese als (vom img verdeckte) Hintergrundbilder für die a-Elemente. Beim Hovern läßt Du dann die img mit visibility:hidden verschwinden, so daß der Hintergrund sichtbar wird.

Prüfe mal bitte, ob eine der beiden Ideen in Deinem Fall anwendbar ist.

Viele Grüße vom Længlich

Danke für deine Erklärung. Vor allem die zweite sieht sehr vielversprechend aus, bis jetzt leider noch nicht von Erfolg gekrönt:

a:hover {
      visibility: hidden;
}

<div id="icons">
<a class="icon1" href="seite1.html">Text fuer Leute ohne Grafik</a>
<a class="icon2" href="seite2.html">Text fuer Leute ohne Grafik</a>
</div>

#icons {
 position: relative;
 top: 130px;
 left: 5px;
}
#icons a {
 width:75px;
 height:75px;
 border:0;
 margin:0px;
}

.icon1 {
 background-image:url(Pfad/icon1.jpg);
}

.icon2 {
 background-image:url(Pfad/icon2.jpg);
}

Damit erreiche ich  bis jetzt leider nur, dass das ursprüngliche Icon erst flattert und dann verschwindet. Jedoch das leider ohne das eigentlich dahinter sich befindende Background-image zum Vorschein kommen zu lassen.

Grüße
frank