afbeelding en tekst hover

Hi,

Ik heb voor mijn lay-out een vak met evenementen. Hier staat in: Datum, 02-11-2011 en Wat

Dus zo:

Datum: 02-11-2011
Wat

In de html doe ik het zo;

<div class="rkop"><h1>Evenementen</h1></div>
        <div class="rcon" >
                        <div class="kall" style="margin-top: 10px;">
                    <a href="#" style="margin-top: 7px;">Datum: <em>30 September 2011</em></a>
                    <p>Toernooidivisie C Rolstoelbasketbal - Roden</p></div>
        
                </div>
                    <div class="rbot"></div>

Maar nu wil ik als ik over de afbeelding heen ga dan de tekst ook van kleur ect veranderd.
Hoe kan ik dit het beste doen?

Groet,

Patrick

a:hover {color:#kleurcode}

Dat heb ik, maar dat werkt niet:

.kald:hover {background-color: #C04A34; width: auto; height: 46px; font: normal 12px Verdana; color: #000; text-shadow: 0.1em 0.1em 0.05em #fff;}

nee zo werkt het niet.

css:

.kald {blabla...}
.kald a {color:#kleurcodeA;}
.kald a:hover {color:#kleurcodeB;}

Ja, maar dan is het niet al het tekst wat er staat

ow sorry, dan moet je met de mouseover functie werken dan kan het wel

En hoe doe ik dat?

Bump

je kan ook alle tekst tussen de P tag zetten

link +tekst

en in de css: p {color:#000;} P:hover {color:#fff;}

Therose schreef:

je kan ook alle tekst tussen de P tag zetten

link +tekst

en in de css: p {color:#000;} P:hover {color:#fff;}

Dat werkt niet.

in je css, .rcon:hover .kald { /* blabla */ }?

Superb schreef:

in je css, .rcon:hover .kald { /* blabla */ }?

De rcon heeft er niks mee te maken. Het gaat om de .kald, maar dat werkt ook niet.

Patricka schreef:

Eerdere citaten tonen

Therose schreef:

je kan ook alle tekst tussen de P tag zetten

link +tekst

en in de css: p {color:#000;} P:hover {color:#fff;}

Dat werkt niet.

ik heb dit net even op mijn site getest en bij mij werkt het wel?
Je moet wel die p specifiek bij die .kald div zetten.
dus

.kald {blabla}
.kald p {color:#code;}
.kald p:hover {color:#code}

Het probleem is dat ik het zo moet doen:

.kald { width: auto; height: 46px; background-color: #c55a45; margin-left: 10px; margin-top: -10px; margin-right: 10px;}
.kald em {font: normal 12px Verdana; color: #fff; text-decoration: none; text-shadow: 0.1em 0.1em 0.05em #000;}
.kald p {font: normal 10px Verdana; color: #fff; text-decoration: none; text-shadow: 0.1em 0.1em 0.05em #000;}
.kald a {font: bold 12px Verdana; color: #fff; padding-left: 10px; text-decoration: none; float: left; text-shadow: 0.1em 0.1em 0.05em #000;}
.kald a:hover {font: bold 12px Verdana; color: #000; float: left; text-shadow: 0.1em 0.05em 0.05em #fff;}
.kald:hover {background-color: #C04A34; width: auto; height: 46px;}

En dat wil niet.

maar je css is niet zoals in mijn voorbeeld?
Ik mis die p:hover...je moet niet die .kald:hover doen