obrázek jako odkaz, ale bez hoveru

Ahoj, potřebovala bych prosím poradit. Mám nastaveno a:hover {background-color: #7E0C09; color: #FFDB6E; text-decoration: none}, což je myšlený pro textový odkaz. Ale když mám jako odkaz obrázek, objevuje se mi hover odkazu i kolem obrázku, dole a zprava a nevím, co s tím. Vím že takových dotazů je tu dost, plno jsem jich četla a zkoušela všechno možný.

Chtěla jsem nastavit pro všechny obrázky průhledný pozadí, jak jsem se dočetla na jednom webu, jako img {background-color: transparent}. To vůbec nefungovalo.

Tohle - .pruhledny {background-color: transparent} - funguje jenom když každý obrázek hned obalím <div class="pruhledny">, třeba takhle <a href="nekam"><div class="pruhledny"><img src="neco"></div></a> ale musí to být ještě před dokazem, jinak taky nejde. (A nechce se mi kolem každýho obrázku dělat div navíc). Což nechápu nejvíc, mělo by to fungovat snad stejně, ne? Nebo je tenhle zápis úplná blbost? Našla jsme to jako návod přímo k tomuhle problému, ale pak jsem se tady na diskuzi dočetla, že to jde řešit i jako img {display: block} a to funguje dobře.

Takže by mě zajímalo, co z toho je lepší, jak to řešíte vy a jestli někdo ví, tak kde je chyba v tom prvním zápisu?
Děkuju, Terka

Když jsem dala jen img {display: block}, jak jsem psala včera,obrázky co nebyly odkazem mi to házelo pod sebe.

a img {border: none} funguje, ale v Opeře mi to obrázky-odkazy podtrhává barvou hoveru pořád.

Takže po zkoušce je nejlepší asi a img {display: none} ...

A díky všem:))

Né, tak já nevim, už sem fakt zoufalá. Když nastavim display: block, tak se mi ty obrázky všude, kromě IE, přesunou vlevo, i když jsou třeba v třídě, která je nastavená na zarovnání vpravo...

Prosím, to mi fakt nikdo neporadíte? Asi je to jen chyba začátečníka, ale fakt vůbec nevim, jak to řešit. V hlavičce mám obrázek (logo.jpg), stylopis je

#hl {background-color: #7E0C09;
width: 750px}

#hl-znak {background-color: #7E0C09;
text-align: center;
float: left;
width: 175px;
margin-top: 8px}

#hl-logo {background-color: #7E0C09;
margin-left: 175px;
text-align: center}

V opeře se totiž pod najetí na tohle logo objevuje podtržení v barvě hopveru odkazu, což nechci.

Když dám a img {display: block}, tak podtržení sice zmizí, ale to logo se posune na začátek divu, takže už má jen odsazení 175px od začátku #hl, ale není zarovnaný na střed #hl-logo. A to zarovnání vlevo dělají všechny obrázky, co jsou odkaz, i když jsou v divu nastaveném na text-align: center (kromě IE, tam to jde).

Nebo ještě funguje

<div id="hl-logo">
<a href="../ostatni/uvod.php">
<div class="pruhledny">
<img src="../logo.jpg" width="394px" height="155px">
</div>
</a>
</div>

kde je .pruhledny {background: transparent} (NEBO TAKY .pruhledny {border: none}) , ale zase nechci všem obrázkovým odkazům přidělávat třídu, chtěla jsem to udělat nějakou globální definicí v externím stylu, ale asi nevím zápis, protože když dám a img {border: none}, funguje to jenom u některých odkazů, stejně jako a img {background: transparent}.
Tak jestli někdo víte jak na to, poraďte prosím, nebo aspoň hoďte odkaz, ráda si to přečtu sama.

Sice nechápu, jak může vertical-align: middle ovlivnit hover, ale funguje to, u obrázků, v galerii, v hlavičce:)) V Opeře i IE. Jenom jeden problém, u vstupní stránky se v IE pořád objevueje hover, pro změnu jako rámeček po pravý straně objektu.
Je to tady, jestli se na to někdo můžete mrknout...

Tak to by mě zajímalo proč. Ale hlavní je, že jinak to funguje, vstupní stránku jsem asi stejně chtěla zrušit...

Takže za to všem díky, hlavně Davexovi a pokud se někdo mrknete na ten index, budu ráda, když poradíte...