Question 44639 in Html Question posted in
Some basic documentation can be found here.

How to hide image broken Icon using only CSS/HTML and without using display: none?

I can’t hide image broken icon. If I display none, it will not display my css.

 <img 
        className="card__image" 
        src={image ? image : ""}
        alt={name || ""}
      />

I want to remove just broken icon without touching css
example

Tags:

2

Answers


  1. Chosen as BEST ANSWER
    0 
    {image && name ? (
        <img
          className="card__image"
          src={image}
          alt={name}
        />
      ) : (
        <div className="card__image"></div>
      )}

    This approach worked for me. Thank you, I just figured it out.


  2. 0

    There are several ways are existsing to hide elems in css instead display: none

    Use:
    opacity: 0; to make elem disappear but it remains to be interactive

    Or use:
    visibility: hidden to hide that.

    Use pointer-events: none to make it non-interactive

    Login or Signup to reply.
Please signup or login to give your own answer.

Back To Top
Search