derrick1451 / Blog_preview_card

Frontend Mentor - Blog preview card

This is a solution to the Blog preview card challenge on Frontend Mentor. Frontend Mentor challenges help you improve your coding skills by building realistic projects.

Table of contents

• Frontend Mentor - Blog preview card
  • Table of contents
  • Overview
    • Blog preview card
    • The challenge
    • Links
  • My process
    • Built with
  • Author
  • Acknowledgments

Overview

Blog preview card

This a HTML and CSS challenge that tests your skills on creating a blog preview card.

The challenge

Users should be able to:

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

Links

• Solution URL: solution URL here
• Live Site URL: live site URL here

My process

• First implemented the structure of the card with HTML and then started up with the mobile first approach with the styling

Built with

• Semantic HTML5 markup
• CSS custom properties
• Flexbox
• CSS Grid
• Mobile-first workflow
• Styled Components - For styles

Author

• Website - Okongo Derrick
• Frontend Mentor - @derrick1451
• Twitter - @derrickhayle

Acknowledgments

I would like to thank Frontend Mentor for giving me this opportunity to showcase my skills. as well as the Open Source Community for providing vast resources for free that helped in various stages of this project.