Learn CSS3 Flexbox to create responsive web layouts easily! Master layouts and elevate your web design skills with our fun tutorial!
This course is all about using CSS3 Flexbox to create amazing, responsive layouts for your websites! You'll be guided through the essential properties and even get to practice with mini-projects. Plus, there's loads of support along the way!
This tutorial teaches you how to use the new CSS3 Flexbox box model to create responsive web layouts more effectively!
After this course, you'll be able to use Flexbox to...
vertically align any element
create modern grids
take up remaining space
add spacing between elements
implement complete site layouts
and much more!
More goodies inside this course:
I'll answer all questions you may have along the way to make sure you reach your learning goals
I've added manual, high-quality captions (CC) to this course
To see Flexbox in practice, 3 mini-projects will manifest your skills and enable you to use Flexbox productively in future web design projects.
What Students Say About Me (taken from various courses of mine)
Such a great course. second one for me with Peter Sommerhoff.
a great Instructor, uses very easy way to explain the materials.
- Ahmed
I absolutely LOVE this course, it teaches everything you need in details
and more! They really do listen to their students and answer as fast as
the road runner. Thanks so much for posting your course and I am
looking forward other courses!
- Ana
Great course, Peter explained it thoroughly, and he answers any questions within a day.
- Dunja
The course covered the required information quickly and concisely
without fluff or wasted motion. It provides sufficient pointers to
additional information and documentation. I thought it was a good
value.
- Robert
I'm glad to have received such great reviews from my students -- and I'll do my best to provide you with the best learning I can as well.
Check out the free preview videos below.
I look forward to seeing you inside :)
***
In this tutorial, you'll learn to use each and every Flexbox property:
Styling flex containers:
flex-direction
justify-content
align-items
flex-wrap
align-content
Then individual flex items:
order
align-self
flex-grow
flex-shrink
flex-basis
flex
At the end, we'll look at real-world Flexbox examples to see what kinds of layouts can be achieved:
Simple grids with Flexbox where all columns in a row have the same size
More advanced Flexbox grids where columns can have arbitrary sizes
Vertical centering to vertically align any element
Media objects, the popular OOCSS pattern
The Holy Grail Layout, a complete site layout with sidebars and sticky footer
As a bonus, this course includes a complete Flexbox Cheat Sheet that you can use to recap all you've learned and to refer back to while using Flexbox.
Additionally, I included the code for a Flexbox demo showcase -- which is like an interactive cheat sheet for you to see in the browser that contains every property and every layout example from this tutorial.
Use CSS Flexbox confidently to create modern layouts
Create web site designs more effectively
Write high-quality and reusable CSS code
1 Lectures
4 Lectures
5 Lectures
5 Lectures
6 Lectures
Hi, it's Peter, glad you made it here! If you're anything like me, you want to always keep learning, master new skills, and ultimately achieve your life goals -- whether that's a well-paying career, traveling the world, working from the comfort of your home, or sharing your expertise with and helping other people.Does that sound like you? Then make sure...
Great course I have a learn a lot about flexbox.
It really gives me some ideas about what I will implement in my future work:)
Must take the quiz seriously, because it's pretty tricky and interesting.
Nice course for beginners. Clear explanations.
Excellent course for beginners. Thanks Peter.
Simple and Easy explanations Easy to understand
Good course for beginners
Good course. Clear explanations. Plenty of Examples.
Yes it was amazing so far!
This is a great course! Its concise while still being very thorough. It is a quick, deep-dive into Flexbox with a lecture for each property with some demos. I would recommend this for anyone looking to learn flexbox.
Your email address will not be published. Required fields are marked *
Ruphus T. D.
Vraiment magnifique!