Skip to content
Submitted over 1 year ago

Results-summary-component CSS, html, flexbox

jotaprojects•100
@jotaprojects
Preview site (opens in new tab)View code (opens in new tab)
This is a solution for...Results summary component
  • HTML
  • CSS
1newbie

Design comparison

SolutionDesign

Solution retrospective

For this project I had some questions:

  • How should we define the height of the component? Should the button be visible on smaller screens like mobile?
  • Which is the best set to define the headings in this component? Should we use headings?
  • Is is better to use class name based on the color or the content when it comes to the summary boxes?
  • What do the challenge mean with focus stace? Should focus state be the same as hover?

Community feedback

  • markus•2,160
    @markuslewinPosted over 1 year ago

    LGTM! I'd change height: 100vh to min-height: 100vh, so that the card doesn't fly off-screen for smaller heights in the desktop view.

    Yes, I think they want the focus state to be the same as the hover state.

    1

Please log in to post a comment

Log in with GitHub

Join our Discord community

Join thousands of Frontend Mentor community members taking the challenges, sharing resources, helping each other, and chatting about all things front-end!

Join our Discord