img alt html/css

styles.css

/* https://stackoverflow.com/questions/22051573/how-to-hide-image-broken-icon-using-only-css-html */

.image {
      position: relative;
      // height: 70px;
      width: 70px;

      img {
        border-radius: 50%;
        height: 70px;
        width: 70px;

        &[alt]::after {
          border-radius: 50%;
          border: 1px solid #000; /* outset */
          display: block;
          position: absolute;
          top: -26px;
          left: 0;
          height: 70px;
          width: 70px;
          background-color: #fff; // #107c10;
          color: #000;
          font-weight: 300;
          font-size: 30px;
          // line-height: 2;
          // text-align: center;
          display: flex;
          align-items: center;
          justify-content: center;
          content: attr(alt);
        }
      }
    }