/Order-summary-component

This is a solution to the Order summary card challenge on Frontend Mentor

Primary LanguageCSS

Frontend Mentor - Order summary card solution

This is a solution to the Order summary card challenge on Frontend Mentor. I started this challenge to improve my CSS skills.

Table of contents

Overview

The challenge

It consists in creating a simple responsive card design where users should be able to see hover states for interactive elements. This is a good project for beginners who are starting to build confidence with layouts.

Screenshot

image

My process

Built with

  • Semantic HTML5 markup
  • CSS custom properties
  • CSS Variables
  • Flexbox
  • Mobile-first workflow

Useful resources

  • CSS Flexbox: A Complete Guide - This is an amazing article which helped me using flexbox. I'd recommend it to anyone still learning this concept.
  • Screen sizes - This helped me as reference for using popular screen size for responsive design.

Access Project

Author