Po najechaniu na div, pokazuje się inny tekst - problem

[ariel_matrix]

Witam serdecznie,

Chcę wykorzystać pewne rozwiązanie mianowicie:
zrobiłem kafelki z div'ów i po najechaniu na dany kafelek, ma pokazać się tekst ukryty pod nim, jednakże nie pokazuje się on...
Zastosowałem następujące rozwiązanie:


.oferta{ width: 246px;
height: 132px;
margin: 3px;
float: left;
text-align: center;
background-color: #ef004f;
color: #fff;
padding-top: 114px;
cursor: pointer;
}
.hidden{
display: none;
}
.oferta:hover > .visible{
display: none;
}
.oferta:hover > .hidden{
display: block;
}

w docelowym artykule wpisuje tak:

<div class="oferta"><div class="visible">
<p>Oferta1</p>
</div>
<div class="hidden">
<p>Ultrices vel urna non, cursus aliquam neque. Nulla facilisi. Sed facilisis nibh.</p>
</div>
</div>
<div class="oferta">
<div class="visible">
<p>Oferta 2</p>
</div>
<div class="hidden">
<p>Ultrices vel urna non.</p>
</div>
</div>
<div class="oferta">
<div class="visible">
<p>oferta 3</p>
</div>
<div class="hidden">
<p>Ultrices vel urna non, cursus aliquam neque. Nulla facilisi. Sed facilisis nibh.</p>
</div>
</div>

Jednak, coś nie działa i nie pokazuje się mi ukryty tekst, ktoś cos wie możę?

[maskodka]

link do strony

[ariel_matrix]

ok już doszedłem co i jak...
zmieniłem visible na visible1, a hidden na hidden1 i jest ok :)

[zwiastun]

No tak, używanie słów kluczowych jako nazw klas to zły pomysł.