CODEWITHSUNDEEP
htmlcss
MorganFreeFarm
MorganFreeFarm

Reputation: 3733

Is there a way to hide only parent element from print?

HTML (example):

<a href="" class="" id="href-test-anchor"><img src="" id="img-test" /></a>

So I want to hide only anchor not img:

@media print
{    
    #href-test-anchor
    {
        display: none !important;
    }
}

This code hide and img tag, is there away to do it?

Upvotes: 0

Views: 88

Answers (2)

yosh
yosh

Reputation: 178

(EDIT: because it got deleted)

Use visibility instead.

#href-test-anchor 
{
    visibility: hidden;
}

#href-test-anchor img
{
    visibility: visible;
}

Doesn't really make sense as to why you are using an anchor, as you are not hyperlinking any text. You could use a div as an alternative; but this does work with an anchor.

Upvotes: -2

Temani Afif
Temani Afif

Reputation: 272909

Use visibility instead:

a {
  border:5px solid red; /* You will not see this */
  visibility:hidden;
} 
img {
  visibility:visible;
}
<a href="" class="" id="href-test-anchor"><img src="https://picsum.photos/id/10/200/200" id="img-test" /></a>

Upvotes: 3

Related Questions