CSS- target text links with bottom border on hover, but image links with no border -
I want to be able to target the link of text in CSS with hover over margin, but all links are images There is no limit on the hover therefore:
& lt; A href = "#" & gt; & Lt; Img src = "image.png" / & gt; & Lt; / A & gt; ==> This should not have a border border on the hover & lt; A href = "#" & gt; Regular text links & lt; / A & gt; ==> There should be a border limit on the hover I tried this CSS:
# sidebar a: hover {border-bottom: 1px dotted red; } # Sidebar one: hover img (border bottom: none;) but it does not work ... the anchor is to be targeted instead of the image, I think. I'm hunting around Google and no one knows how to do this by targeting the image link with a specific class or ID or using the block: block.
However, Can not use because the content is in CMS It does not want that user to assign a class in each image that they enter and the display block will not work because I do not know that it will be suitable for every image that the user wants to display.
Sorry, you want to have some kind of: Parents Pseudo-class who chooses a child but mother -Apply on the Father, which is unfortunately not present (not even in CSS3).
You have to do this by selecting all the elements that match the # sidebar A: hover and apply a red border border on the condition that, if they have children IMG element is not there.
Comments
Post a Comment