With Grid and padding

Community feedback

• 

  P

  Dave•5,295

  @dwhensonPosted over 3 years ago

  Hi @herbras nice work on this one looks good to me! 🙌

  As for your question, couple of issues might be impacting this 1) your body isn't filling the viewport completely, try setting min-height: 100vh; on the body, 2) if you combine this with setting display:grid; place-items:center; on the body I think you will be sorted - your design will still be higher because of your footer - I would remove it to see the effect and then assess whether to add it back. I add min-height: 100vh; to all my projects in a CSS reset.

  Otherwise some small suggestions for improvements are:

  1. Try to only use one h1 per page is common advice as it helps with page structure. Your headings in the bottom blocks would probably be better as h2s this helps make the page more accessible.

  2. I would suggest adding some hover styles to the button and `cursor: pointer' so that it is easier for users to see that the element is clickable - at the minute it's not that obvious, this is a common patter for most buttons.

  In case you are interested, this is the reset I use in all my projects. I've found it to be very useful: https://piccalil.li/blog/a-modern-css-reset

  But otherwise this is a great job! 👍 Keep up the good work! Cheers 👋

  2
• 

  Sarbeh•100

  @herbrasPosted over 3 years ago

  wow. I think this will be very helpful. Thank you so much

  0