Responsive web design with flexbox and media queries

What are you most proud of, and what would you do differently next time?

The project itself was easy, I was able to use both flexbox, media queries for a responsive design. I have used and for enclosing the content within it. I have used id attribute on section called #main and have used a class .first-division. I have created a separate CSS file for styling, called app.css. Both #main and .first-division have a display of flex, #main has a flex-direction of row, while .first-division has flex-direction of column, and have applied justify-content to flex-start. I have provided #main with a padding of 115px on top and bottom to be able to center the .first-division. I have used padding and scale to increase the size as well as to manage white space as per the reference on and . I have also used to positioning to shift content to the top relatively. I have used media queries at 580px, 480px and 375px.

What challenges did you encounter, and how did you overcome them?

I was using max-width property but not box-sizing property to control the flow of the content. I remembered to apply it, and it worked better.

What specific areas of your project would you like help with?

I believe I come to the same results with more number of steps, maybe i would like examples of how i could have done it differently in a fewer steps, or what could have been more efficient solution.