Klasse in Klasse ansprechen

[Isma]

Hallo SELFHTML-Forum!

Ich scheitere gerade an einem Anfängerproblem: Ich will eine Klasse innerhalb einer Klasse ansprechen.

Ich habe mein eigentliches Problem wie folgt vereinfacht:

<style>
.footer a:hover {background:yellow}
.footer .rot a:hover {background:red}
</style>

<div class="footer">
<a href="#">Lorem <span class="rot">ipsum</span></a>
</div>

Müsste nicht "ipsum" einen roten Hintergrund erhalten, sobald der hover-Effekt ausgelöst wird? Wie spreche ich die Klasse "rot" an?

Beste Grüße
Isma