Frontend Mentor - Order summary card solution

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

Table of contents

• Overview
  • The challenge
  • Screenshot
  • Links
• My process
  • Built with
  • What I learned
• Author

Overview

The challenge

Users should be able to:

• See hover states for interactive elements

Screenshot

desktop 1440px:-

mobile 375px:-

Links

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

My process

Used HTML, CSS to create Order Summary Componenet Hub. Implemented flexbox property to align columns within the row ,css variables and used media queries for responsive web design.

Built with

• Semantic HTML5 markup
• CSS custom properties
• Flexbox
• CSS Grid
• Mobile-first workflow
• CSS variables
• Media Query

What I learned

If you want more help with writing markdown, we'd recommend checking out The Markdown Guide to learn more.

Author

• Website - @kudos2shef
• Frontend Mentor - @kudos2shef