A simple approach to layouts when going from design to code

When we have a static design file, whether that’s a Figma design or a .jpg file, often the hardest part is breaking down and figuring out how the layout is going to work. In this video, I take a look at how you can break down a layout into it’s pieces to help make the process a lot easier. 🔗 Links ✅ The Frontend Mentor Project: ✅ Modern CSS by Stephanie Eckles: ✅ How to pick when to use Flexbox and Grid: ⌚ Timestamps 00:00 - Introduction 01:05 - Draw boxes around EVERYTHING 04:00 - Then see how those boxes are organized 09:00 - Turning the layout into HTML 13:10 - Doing the same thing for the smaller pieces 16:30 - Why I look at the desktop design even if I code mobile-fi ... #KevinPowell #Kevin_Powell #css #front-end #frontend #html #web_development #design_to_code #css_layouts #breaking_down_a_layout 20231017 kmFr_8U81vU