22.09.2006, 22:45
|
|||
|
|||
Border bei Grafik in Link
Hallo.
Ich bin noch ziemlich neu in Sachen XHTML und CSS, darum hackt bitte nich auf mir rum^^ Zu meinem Problem. Ich brauch Bilder in Links also <a href="#"><img...></img></a>. Das Problem ist nun, dass ich dabei auch noch einen Rahmen um das Bild haben möchte, der sich bei a:hover farblich ändert. Im IE 6 bekomme ich das wunderbar hin, aber in FF und Opera gibt es entweder gar keinen, oder einen nach unten verschobenen Rahmen, der nur ungefähr eine Zeile hoch ist. Hier mal der reduzierte Code Code:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="content-type" content="text/html;charset=utf-8" /> <title>Bodehold</title> <link href="bodehold.css" rel="stylesheet" type="text/css" media="all" /> </head> <body> <div class="bhd_bild_links"> <a href="bild.gif"><img src="bild-klein.gif" alt="Bodehold.de v2" width="100" height="96"></img></a> </div> </body> </html> Code:
.bhd_bild_links {
margin: 5px;
padding: 5px;
border-width: 1px;
border-style: solid;
border-color: #000000;
}
img {
border: 0px;
}
.bhd_bild_links a,{
border: 3px solid green;
}
.bhd_bild_links a:hover, {
border: 3px solid red;
}
MFG und vielen Dank im Vorraus bodehold 
|
| Sponsored Links |
|
22.09.2006, 23:49
|
||||
|
||||
|
Hallo und herzlich willkommen!
Du musst img ansprechen: also .bhd_bild_links a img { } und .bhd_bild_links a:hover img { }. Das Komma dahinter kannst du weglassen. Ah und übrigends: <img></img> sollte <img /> lauten 
__________________
The only thing to do with good advice is pass it on. It is never any use to oneself. - Oscar Wilde - #me { position: absolute; }
|
| Sponsored Links |
|
23.09.2006, 08:45
|
|||
|
|||
|
Zitat:
Das funktioniert soweit auch ganz gut, nur ist der Effekt jetzt im IE nicht mehr vorhanden  Der IE macht es ja, wenn ich das img anspreche. Muss ich jetzt nur noch das andere wieder vor ihm verstecken? Ich werd mal nen Bischen rumprobieren, bin aber für Tipps dankbar  Zitat:
  Ein ausdruck der Verzweiflung tausender Versuche mein Problem zu lösen  Das Komma ist noch da, weil es ein bereinigter Code is...da würden noch mehrere Klassen folgen...edit// Sehr gut. Vielen Dank für die Hilfe. Ich hab das jetzt auf folgende Weise gelöst. Code:
.bhd_bild_links {
margin: 5px;
padding: 5px;
border-width: 1px;
border-style: solid;
border-color: #000000;
}
img {
border: none;}
html>body .bhd_bild_links a img {
border: 3px solid green;
}
html>body .bhd_bild_links a:hover img {
border: 3px solid red;
}
* html .bhd_bild_links a {
border: 3px solid green;
}
* html .bhd_bild_links a:hover {
border: 3px solid red;
}
Vielen Dank nochmal! Geändert von bodehold (23.09.2006 um 09:30 Uhr)
|
 |
| Themen-Optionen | |
| Ansicht | |
|
|
Ähnliche Themen
|
||||
| Thema | Autor | Forum | Antworten | Letzter Beitrag |
| link als Grafik formatiert, lösungsansatz gesucht | lila_3 | CSS | 3 | 15.07.2009 12:19 |
| Grafik vor Text Link | velli | CSS | 5 | 09.02.2009 23:59 |
| Wie Grafik links neben Link ausgeben? | Pumpkin | CSS | 3 | 15.11.2008 17:00 |
| CSS Navigationsproblem | thesecretboy | CSS | 0 | 12.04.2007 08:12 |
| image link hoover / activ border | Holger (HMR) | CSS | 4 | 15.09.2005 13:42 |
Linear-Darstellung
