Affecting child elements by modifying the parent by CSS. is it possible?
===

Maybe it's a silly question, but I'm sure it will be useful for many of beginners. I have constructed a code. What I'm trying to do is to display the text (in `<p>` tags) which is currently hidden, only when the actual `<a>` is hovered. Is this possible without js? Can it be done by operating on css / html only?
the html code is here:

                    <div class="promo2">
                        <a href="speakers-hire.html">
                            <div class="promo2a">
                            	<p>SPEAKERS</p>
                            </div>
                        </a>
                        
                        <a href="decks-hire.html">
                             <div class="promo2a">
                            	<p>CD PLAYERS</p>
                            </div>
                        </a>

                    </div> 

and the css which correspond to the above html:


    .promo2a:hover{
	background:url(../_images/generic/glass5.png);
	display:inline-block;

}

    .promo2a p{
	display:none;
}


So basically I want the text in `<p>` to be displayed when the whole div `promo2a` is hovered.

Any help is kindly appreciated. Thank you in advance.