CSS Grid & HTML

Community feedback

• 

  Danilo Blas•6,300

  @Sdann26Posted over 2 years ago

  Hello Abdulquddus Ibrahiml!

  There are things to improve so I will comment them to you:

  The first thing is that you put to the body the attribute margin: 0 so that this white border around the page is not present.

  Moreover, to avoid having to do this by hand, do some research on normalize CSS and reset CSS, it will help you to start projects by resetting the default styles of the browsers.

  The other thing is that I do not recommend you to give size only in pixels, there are projects that do not go well like this one because in very big screens the card looks huge and in mobile devices it is not even seen because it is very tight. You could leave the .card class with a width: 280px and it would still look good for all types of devices.

  On the other hand you have not put the typography, below the <link> tag that contains the link of all your CSS code add it:

      <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=Outfit:wght@400;700&display=swap"
        rel="stylesheet"
      />
  

  And for the font styles to be on your page in your CSS place:

  html{
     font-family: font-family: 'Outfit', 'sans-serif';
  }
  

  This I know it because this way it indicates you in style-guide.md that is a file that this at the time of decompressing the files to make the challenge there not only the colors also type of typography at the end.

  And finally just modify the size of the texts so that it is like in the design, if you can use REM instead of PX.

  That would be all I hope my comments will be of help if you have doubts consult!

  Marked as helpful

  0