CSS Resources
Are you ready to push the boundaries of CSS animation? This challenge will put your skills to the test as you explore powerful techniques to create immersive and interactive web experiences.
- Flexbox Froggy: Flexbox Froggy is a fun and interactive way to learn and practice CSS flexbox layout. It provides a series of levels where you need to move frogs to specific positions on the screen using flexbox properties.
-
Kombai: Kombai is a platform that offers coding challenges and competitions to help developers improve their skills. It provides a variety of challenges across different programming languages and domains.
-
CSS Battle: CSS Battle is a website where developers can compete by writing CSS code to replicate target images. Participants aim to write the most concise CSS to recreate the given designs, earning points based on accuracy and efficiency.
-
CSS Challenges: CSS Challenges is a collection of creative coding challenges aimed at helping developers improve their CSS skills. It offers various challenges of different difficulty levels to test and enhance CSS knowledge.
-
Frontend Mentor: Frontend Mentor is a platform designed to help frontend developers improve their skills by working on real-world projects. It provides a range of challenges with designs provided as static images, encouraging developers to implement them using HTML, CSS, and JavaScript.
Recreate the Share IT Mentors layout to use Flexbox.
4 column layout consisting of a photo, name, job title, email, and optional phone number. Content should be centered on the page and have a max width of 1280px.
** Ensure the layout is responsive across all viewports i.e. Desktop, Tablet, and Mobile Phone
How to use Flexbox
A Guide to Flexbox
Resources (HTML, CSS, JS, & Images)
Mentor Page (.zip)