@emestabillo
Posted
Hey Petru, good work here. For your question, I don't see a nav for this particular design, so I'm assuming the issue is setting an explicit height for the mobile view. If you remove the heights set for main_container
and testimonials
, the content will naturally stack, just like the mobile design.
A few more thoughts:
- Use mobile-first for CSS. It's easier to scale up your contents than make large elements fit into smaller screens.
- I would remove the
height
andwidth
styles for thehtml
andbody
. You don't need them for this particular design. Let the content dictate the dimensions of the project. - The layout looks really squished at 376px. Adjust the breakpoint so that it breaks into desktop view at an appropriate screen width, around 992px or above.
main_container
doesn't need a huge margin around it. Center the element withmargin-inline: auto
. It also doesn't needgrid
. It's children arediv
andsection
- both are display: block by default (will span the entire row) and will therefore stack.- Add a README.md for us to get a peek at your process.
There's a bit more to unpack here but I think more practice with flexbox and grid will help you improve on your next project. Hope this helps! :-)
Marked as helpful
@Petru14
Posted
@emestabillo Thank you for your feedback!