Responsive layout with Flexbox and element geometry configuration.
This project is the third assignment of the GoIT Full Stack Developer course. It builds on the previous work by introducing CSS Flexbox for layout and positioning of elements. I focused on configuring element geometry, margins, paddings, and borders. The project also includes image optimization and uses the modern-normalize
stylesheet for consistent cross-browser styling.
The design mockup used for this assignment can be found here.
All screenshots related to the project can be found in the images folder.
In this project, I have:
- Applied Flexbox for layout and element positioning.
- Configured margins, paddings, and borders based on the design mockup.
- Used semantic HTML and CSS best practices.
- Optimized images using the Squoosh service.
- Added and customized modern-normalize to reset default styles.
This assignment strengthened my skills in responsive design, layout structuring with Flexbox, and using CSS for fine-tuning element geometry.