how to separate anchor link and anchor hover img in CSS

[sniperman]

Hi

I have a current coding problem. I currently have the below code as follows for all links related to anchor elements.


a:hover {
background-color:#a4cf4f;
color:#FFFFFF;
padding-bottom:1px;
padding-left:3px;
padding-right:3px;
padding-top:1px;
text-shadow:1px 1px 0 #0964A0
}

The problem is that this also applies itself by default to all image tags within an anchor tag.


<p><a href="http://www.madchaos.com.au/image.jpg"><img src="http://www.madchaos.com.au/" /></a></p>

I need to be able to have CSS treat images within anchor tags differently to text within anchor tags. This is also through a Wordpress framework so I have no real control over the mark-up in which images are displayed.

[bluewalrus]

You can be more specific with your css.


a:hover img {


to target a link with an image tag within it that is being hovered over. If all your fields had spans in them you could do


a:hover span {

[sniperman]

I actually tried that method but still, the underlying anchor tag still activates its styles no matter whether the image has styles attached.

Is there a parent child selector method available to pick say every anchor tag of an image


a:link < img

simply put, i want to apply a style to every anchor tag except anchor tags with images nested within the anchors.