First Challenge - Using Flexbox

Community feedback

• 

  Jason Heys•175

  @heyitsganyPosted about 3 years ago

  Looks good. Well done on getting it close to the design.

  • Couple of things to work on, you haven't implemented the hover/active states for the buttons and links (change, proceed and cancel). That's a pretty simple thing to add.
  • Try to move the background image from your HTML to your CSS, using the background property. This way you have greater control over how it displays. (Also tweak your background colours as they're off a little).
  • Make sure you're using semantic HTML (div and span are non-semantic), make use of elements like header, footer and main. As your card is the main content of the page, change it from <div class="order-card"> to <main class="order-card">.
  • Finally, (and this is a preference thing) you could remove the box-sizing from your html and just use it on your reset.

  *,
  *::after,
  *::before {
      margin: 0;
      padding: 0;
      box-sizing: border-box;
  }
  

  Marked as helpful

  1
• 

  Pablo Clemente•60

  @PabloMClementePPosted about 3 years ago

  Hi @heyitsgany - Thanks a lot for all these tips. They really are very useful, and i try to apply then. Thanks

  0