Social proof challenge using HTML & CSS

Hello Melissa, congrats on finishing the challenge!

It looks great at desktop, but as you said, it brokes because the content doesn't flow when using position: absolute; (unless you create a tons of media queryes for different position values, wich is not a good practice!).

As an advice, try to avoid as much as you can using position: absolute, try getting your general layout using flex-box or grid (in this case I think grid would fit better). Avoid using tables for the layout, try using sections, div, footer, header tags instead!

In the other hand, why don't you try building your site mobile first?, you can start building your project from a mobile screen perspective and then adapt it to desktop sizes using media queries, it will be easier to get a more responsive design than starting building it from desktop sizes!

Hope my feedback helps you!, don't give up on it and really try learning flex-box and grid, you will not regret it!

👾Hello again Melissa Sauve, congratulations for your new solution!

I saw your solution and seems that you've used some legacy css to position the elements, since I don't know the approach you did to build the solution, because I'm new to css too.

I'll give you some tips with some resources that were really meaningful for me in my learning path and learning two amazing tools grid and flexbox:

1.🐸This game to learn flexbox while you align the frog (this is the best way to learn flex) https://flexboxfroggy.com/

2.Css and Grid guides step by step for beginners : https://css-tricks.com/snippets/css/a-guide-to-flexbox/ https://css-tricks.com/snippets/css/complete-guide-grid/

3.Grid by layout with examples (to make the cards): https://gridbyexample.com/examples/

Here's my solution made with grid and flexbox: https://www.frontendmentor.io/solutions/social-proof-section-pure-css-grid-custom-hover-states-KwSrl-Rjws

👋 I hope this helps you and happy coding!