Product preview card

Community feedback

• 

  Isaias Lopez•50

  @lpzisaiasPosted almost 2 years ago

  You did a good job despite the drawbacks you mention! Some recommendations:

  • It is good practice to start with mobile views first.
  • With flexbox, put in the body tag, min-height: 100vh; to center the elements.
  • To use Google fonts, go to the file link and first select the font and its weight, once selected (click on the "+" button to select) copy the generated code in the header of your html file, example:

  <link rel="preconnect" href="https://fonts.googleapis.com">
  <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
  <link href="https://fonts.googleapis.com/css2?family=Roboto:ital@0;1&display=swap" rel="stylesheet">
  

  And below it generates the css code to use: body{ font-family: 'Roboto', sans-serif; }

  • Finally You can try flex-direction: column and row for mobile and desktop view

  Marked as helpful

  0