Blog preview card solution

This is a solution to the Blog preview card challenge on Frontend Mentor.

Overview

The challenge

Users should be able to:

• See hover and focus states for all interactive elements on the page

Screenshot

Links

• Live Site
• Figma

My process

Built with

• Semantic HTML5 markup
• CSS custom properties

What I learned

Use CSS function clamp().

.card-date {
  ...
  font-size: clamp(0.75rem, 3vw, 0.875rem);
  ...
}

Author

• Frontend Mentor - @m4rcone