Profile Card Component using Flexbox

Community feedback

• Account deleted

  Using an img tag for decorative items works, just make sure you include an empty alt tag.

  <img src="file-url.svg" alt="">
  

  Without an alt tag, screen readers will read the src url to the user. Another way you can do it for example => (::before works as well)

  item::after {
    content: ' ';
    height: 100px;
    width: 50px;
    background: url('relative-file-path.svg') no-repeat;
    background-size: 100%;
    background-position: bottom left;
    position: absolute;
    }
  

  It's a bit more finicky that way as you have to explicitly set the height and width, but is sometimes useful in keeping your HTML clean.

  Marked as helpful

  0