Responsive landing page using CSS grid

Community feedback

• 

  P

  Christina A. Pascual•10

  @devchris03Posted 4 days ago

  Hello, your solution is well, but I could like to help you about some things:

  1. Do not set a fixed width for the body, doing so will make it no longer responsive. The centering of the card looks good only when the screen complies with the fixed width you set.
  2. To align the card horizontally you can add a maximum width and add a margin-inline: auto. To do it vertically you can also set a maximum height and calculate the width of the screen - the height of the card, divide by 2 the result and assign the margin-block of the new result.
  3. If the above is complicated for you to understand, you can align with a display:flex. It will be easier to do it this way. I recommend that you can observe a little of it, you will see that it will help you a lot.
  4. It is that you add a maximum width that a fixed width to the card. This will help to make it easier for the design to adapt to any screen.

  I know that with practice you will gain more experience. Keep it up and you will succeed.

  0