Skip to content

Order Summary with indentation style. // Resumen de orden de compra usando Indentación.

Notifications You must be signed in to change notification settings

Boni92/Order-Summary

Repository files navigation

Frontend Mentor - Order summary card solution

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

Table of contents

Note: Delete this note and update the table of contents based on what sections you keep.

Overview

The challenge

Users should be able to:

  • See hover states for interactive elements

Screenshot

file:///C:/Users/Nicolas/Documents/Nicolas/1/Facultad/Programacion/Proyectos%20Propios/FrontEnd_Mentor/Order-Summary/public/design/mine/FireShot%20Capture%20003%20-%20Frontend%20Mentor%20-%20Order%20summary%20card%20-%20127.0.0.1.png

file:///C:/Users/Nicolas/Documents/Nicolas/1/Facultad/Programacion/Proyectos%20Propios/FrontEnd_Mentor/Order-Summary/public/design/mine/FireShot%20Capture%20008%20-%20Frontend%20Mentor%20-%20Order%20summary%20card%20-%20127.0.0.1.png

Links

My process

Built with

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

What I learned

/* border-radius in % works as an oval but use with px works as a circle, gives equal borders. */

Continued development

I have kind of trouble at centering the pictures above the backgroud in order to put them exactly where they are in the challenge photos.

Useful resources

Author

Acknowledgments

About

Order Summary with indentation style. // Resumen de orden de compra usando Indentación.

Topics

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published