NFT Preview Card using HTML, CSS and Flexbox

Community feedback

• 

  Fer•3,970

  @fernandolapazPosted over 1 year ago

  Hi 👋, perhaps some of this may interest you:

  HTML, ACCESSIBILITY:

  • Regarding your comment, when there is a hover state over an element it means that it is interactive, so there must be an interactive element around it (like a link or a button). So, we should use a <a> or <button> to wrap the image (depending on what happened when clicking on it).

  • Every page should have an <h1> to improve user experience and because it is an important element when it comes to SEO. And it is good not to skip heading levels (start with <h1>, then <h2>, and so on).

  CSS:

  • You might consider using some CSS reset as a good practice at the start of each project, to have a clean starting point and reduce differences between browsers. A popular CSS Reset from Josh Comeau 🔎

  For example, these are some very common and useful ones:

  *,
  *::before,
  *::after {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
  }
  

  This will remove the vertical scrollbar you have, for example.

  Please let me know if you want more info on any of these topics or disagree with something. I hope it’s useful 🙂

  Regards,

  Marked as helpful

  1