Freitag, 13. März 2009
Border innerhalb von Grafiken mittels CSS
Auf CSS-tricks.com habe ich eine Möglichkeit gefunden inerhalb von Grafiken Rahmen zu setzen. Es ist eigentlich recht einfach, man muss nur darauf kommen. Man kann nämlich mittels negativem Margin die Border beliebig nach innen ziehen:
#example-one a img, #example-one a { border: none; overflow: hidden; float: left; }
#example-one a:hover  { border: 3px solid black; }
#example-one a:hover img { margin: -3px; }
Border außerhalb
Und auch das ist möglich: “Hover-Border” außerhalb von Grafiken, die das Layout nicht zerstören:
#example-two a img, #example-two a { border: none; float: left; }
#example-two a { margin: 3px; }
#example-two a:hover { outline: 3px solid black; }
Website: CSS-tricks.com
Den gleichen Effekt kann man natürlich auch so erzielen:
#example-three a { border: 3px solid transparent; margin:0; padding:0;float: left; }
#example-three a:hover { border: 3px solid black; }
Popularity: 56% [?]