Chat app illustration

Hey Aryan,

great job so far! :clap:


My ideas:

  • the HTML validation and CSS validation show some small errors, I think you are able to fix them! :+1:

  • I’m having a hard time to read the description, because the contrast ratio is very low (~2.5 according to the ratio checker):
    Screenshot_2020-09-01_07-48-00

  • when I decrease the width of my browser, the footer overlays the description; this is important for people who read your page on a smartphone:
    Screenshot_2020-09-01_07-55-45


Keep up the great work,
looking forward to seeing your next steps! :slightly_smiling_face:

1 Like

Looks nice.

  1. The input is overflowing the container, which is not what the mockup looks like. Not sure if it is intentional or not.

  2. The page needs to stack sooner otherwise the phone will cover up the text.

  3. As said, the attribution is covering the text when the page is stacked. You really shouldn’t reposition elements by pushing them into place using that much padding like you are, it’s bound to cause issues. There are a few different ways of repositioning elements, both flexbox and CSS grid has ways of doing that. But using position is also an option when done right.

  4. I would suggest avoiding using absolute position unless you really have to use it. It just makes the responsive work harder. Use the normal document flow as much as possible.

Great work, keep it up!

1 Like