I'm having a little dilemma with CSS selectors. Basically, I need to set background to none if an
has a child of
This is because on the website, all links have a background style on hover (:hover), but this is also applied to images which are wrapped as a link. So I need to remove the style which is on the a tag when there is an image inside the link.
a:hover > img would work, but I need the apply the style to the a tag not the img tag.
Thanks for any help!
pogoking is right in that you can't do this with just CSS selectors. You can't select backwards essentially (parents).
The best solution is to alter the HTML output. Do a check to see if the anchor tag will contain an image before printing the tag. Give it a class like "anchor-with-img". Then set the background for
.anchor-with-img to none;
So you end up with this structure:
<code><a >Normal Link</a>
<a > Normal Link</a>
<a class="anchor-with-img"><img /></a>
And then apply your CSS