Flexbox design patterns you can use in your projects

Flexbox is amazing, and I honestly feel like sometimes we're just stratching the surface with what we can do with it! In this video I explore three design patterns that you can use in your sites using flexbox.


/// Timestamps
00:00 - Introduction
00:19 - even columns
04:31 - grid-ish
08:13 - content and sidebar
12:45 - spacing things out

#css #flexbox
--

Come hang out with other dev's in my Discord Community

---

Keep up to date with everything I'm up to

---

Help support my channel

---


---

I'm on some other places on the internet too!

If you'd like a behind the scenes and previews of what's coming up on my YouTube channel, make sure to follow me on Instagram and Twitter.


---

And whatever you do, don't forget to keep on making your corner of the internet just a little bit more awesome!

[ihavevoicesinmyhead]

First name to search for when you need anything related to CSS.

[rektosaurus]

im at the very beginning of my webdev journey and i gotta say your content and what you provide for us is priceless, I cant count the number of times I was struggling for hours then i come back to your videos and i find the solution, thank you so much !

[GGdevelopment]

I still don't understand how you have less then 200K subs... You deserve more!

[carstenberggreen]

As always, totally easy explanations and very visually! Keep it up Kevin!

[DannyLevan]

Just wanna say I really like your videos. I've worked in web for close to 10 years and have never properly learned CSS and your videos are just so well made and easy to understand.

[sirharis]

I’ve been winging it with flex for a while and spending countless hours debugging and guessing to make things work with flex but after this overview on the basics, I have a better understanding of flex and how to approach the styling. Nice video, great breakdown.

[etch_kay]

Thanks a ton, lol I was taking ss from your video just to keep a cheat sheet and you offered it, you're probably the best teacher on YouTube... thanks a ton

[firedforfighting]

The CSS God....I spent hours yesterday trying to wrap my head around something like gridish...I sort of gave up but I was so close!!!...You really make CSS cool these vids are a lifesaver

[akshaymondal]

Before diving into web development I went through lots of articles in quora, most of the articles were related to css and all of them said that css is just bullshit, not possible for everyone to cope up with it . It created too much hype in our community that it actually crated fear in out hearts .
But I didn't have any option, so I started with html css .
And then I came across the great kevin powell. You don't know how much you have contributed in my life.

[JustPlaytheTrack]

It never fails. I come to one of these videos for a specific technique, and end up deleting my entire style sheet.

[xphstos_]

I don't know what it is but you're in my head!!!
I was exploring some ways to reduce my media queries while I was working on a project I used this gridi-sh example.

But Kevin, when I say you're in my head I mean it!
This keeps happening for months now!
I find something new and then BOOM here's a new video with you playing with the same stuff!

[felixjimenezgonzalez]

First of all, great video! Everytime I need to refresh flexbox you're the first person I come to!

[devsoldier]

I love your videos. Everytime I get stuck on something and I search youtube it's always one of your videos that get me back on track.

[daveskye]

For spacing margin works well and then you don't have browser compatibility problems.

.parent { margin: -1rem}
.child {margin: 1rem;}

By adding a negative margin to the parent then you don't lose the width. This method works well when using flex wrap.

[abbassher]

Its feel amazing everytime seeing your's video notification on youtube . Thanks alott Sir

[sscip]

Found this guy TODAY!!!! ONLY TODAY!!! THANK YOU Kevin!

[musabas]

I don’t really understand those dislikes. They might have clicked by mistake. Thank you so much Kevin. Another great video. 👍

[edilebert]

You are the nicest YouTuber I've ever seen Mr. Powell! I love watching your content! So wholesome

[jessiz-]

Super helpful - I love the way you teach and go through these concepts. It makes thinking about flexbox so much simpler. grid-ish seems really useful. Thanks Kevin!

[parthparmar]

every time i get to your video i learns atleast one awesome trick to make my projects more effective.
so thanks for that.