This repository contains a series of exercises designed to practice and master fundamental CSS Layouts, focusing on alignment, Flexbox, and Grid systems.
The assignments are located in the problems directory, with corresponding solutions in the solutions directory.
| Problem | Description | Topic |
|---|---|---|
| Horizontal Align | Basics of horizontal alignment | CSS Alignment |
| Vertical Align | Basics of vertical alignment | CSS Alignment |
| Flex Layout | Building layouts with Flexbox | Flexbox |
| Grid Layout | Building layouts with CSS Grid | CSS Grid |
| Complicated Grid | Advanced grid stuctures | CSS Grid |
| VSCode Bottom Bar | Replicating a specific UI component | Real-world UI |
| VSCode Landing Page | Replicating a full page layout | Live Page Clone |
- CSS Fundamentals: Understanding the box model and positioning.
- Flexbox Mastery: Controlling layout in one dimension.
- Grid Systems: Handling complex two-dimensional layouts.
- Component Replication: Translating visual designs into code.
Navigate to any of the problem folders to view the specific requirements.
cd problems/0-horizontal-align
# or
cd problems/6-vs-code-landing-page