Problem mit

[Matthias Scharwies]

Servus!

Also muss ich das machen:

...

Die Live-Beispiele im SELF-Wiki sind hauptsächlich Beispiele, die zeigen wie man etwas machen könnte.

button:focus img,
button:hover img {
...
}

Schau Dir einfach mal an was der Unterschied zum „Normalzustand“ ist:

• border: 2em solid #eee; Das Bild erhält einen 2em breiten, hellgrauen Rand
• border-radius: 1em;der abgerundet wird
• box-shadow: 1px 1px 5px #333;nen Schatten drum rum
• width: 300%; vorher war's 10em → jetzt mal 3
• left: -4%;
• top: -4%; ein bisschen nach links und oben gezogen. (Dort ist die Mauer, sonst würden die Bilder zu weit nach rechts ragen, was beim letzten Bild der Reihe tödlich wäre -> es würde über den rechten Rand ragen.)
• z-index: 5;Das gehoverte Bild liegt über den anderen.

Versuch mal weg vom ersten Schritt des "Copy 'n Paste" hin zum "Trial and Error" zu kommen. Probier eine Eigenschaft oder andere Werte aus und beobachte was passiert. Du kannst dir ja immer funktionierende Versionen unter anderen Namen speichern, sodass nix kaputt geht!

Herzliche Grüße

Matthias Scharwies