Flexbox, @media (max-width)

Community feedback

• 

  Dias•140

  @adambeckercodes

  Posted 8 months ago

  Yes, the solution includes some semantic HTML, such as the use of the <h1> tag for the title or the <p> tag for text. The <img> tag includes an alt attribute, which is a good accessibility practice.

  The use of an alt attribute for the <img> tag improves accessibility. Text is properly structured with headings, which assist screen readers. Although contrast ratios could be improved for better visibility, especially for users with visual impairments. Adding aria-label or aria-labelledby attributes can enhance the semantic value of non-descriptive elements, such as the div used as a container.

  The CSS includes a max-width property for the card, which ensures it doesn’t exceed the container's size on larger screens. The layout is centered and scales down appropriately.

  The CSS is modular and makes good use of classes to apply styles. The structure is clean and readable, following consistent formatting.

  The solution doesn't differ visually from the original design.

  00