The forums ran from 2008-2020 and are now closed and viewable here as an archive.

Home Forums CSS remove link underline from image only if the anchor tag contains an img

  • This topic is empty.
Viewing 5 posts - 1 through 5 (of 5 total)
  • Author
  • #36394


    for the above html code I am using the following css

    a {
    border-bottom-style: dotted;
    border-bottom-width: 1px;

    a img {
    border: 0 none;

    Basically what I am trying to achieve here to underline the text links while keeping img links without any underline. however I guess by styling the text links I am also styling image links, I want any image in a link should not be underlined.

    Can any one suggest work around for this?





    a { border: 1px solid red; }
    .contains-image { border: none; }

    There’s a few methods to get this trick done.

    1. before printing the html- give any ‘a’ with an ‘img’ tag inside it a unique class, and style only the class.
    if you are using any loop to print this data, use an ‘if’ to check if there’s an image to be printed.

    2. after the data printing- use JS to find if an ‘a’ tag have an ‘img’ tag, and if so, give him a unique class.


    3. The slick_rick way- use CSS3 new selectors to get the job done.

    a>img {border-bottom-style: dotted; border-bottom-width: 1px;} 

    more info about css3:



    – A couple of things.

    1) First of all, both of your javascript methods could be achieved with CSS. That CSS is your third example.

    2) That is not “CSS3”. That selector is defined in the CSS 2.1 spec and works on all modern browsers AND IE7+

    3) w3schools isn’t cool. Rather use the Mozilla Developer Network as a resource

    This might interest you too:

    the problem with this trick is you need to target an elements parent.
    You need to detect for all img elements and find an anchor parent and remove the border. This can’t be done with CSS alone right now ( It may or may not exist in future ).

    My example works, here’s a jsfiddle:


    hey @jamy_za , thank u for correcting me.
    and of course you are right about the css, i confused the element > element with the none existing selector, element < element. And I learned alot from the whole w3school stuff, never knew all of that.

Viewing 5 posts - 1 through 5 (of 5 total)
  • The forum ‘CSS’ is closed to new topics and replies.