Stop Using Margins With Flexbox

🌎 Find Me Here:

#Shorts

[alexandergrebennikov]

One of my tasks of recent weeks was to remove about 300 gaps and turn them to margins )

[Deathborn_]

I think it's worth noting that you can just apply a @supports rule so that if gap is actually supported then you can apply that, otherwise as a fallback you can just use margins. Great video otherwise Kyle, keep up the amazing work!

[sarrthecode]

Thanks kyle you're such a blessing especially your js videos, they're just a must for me i went from using js for some interactivity in my web pages to build entire front-end app using js (REACT) and i have also created 2 npm librairies one for manipulating js object and one for forms in REACT.
Thanks Kyle i've learned a lot from you and Kevin Powell

[_PCode_]

Gap is supported on all major browsers and you can also use it on flex layout

[Njb-yptd]

I am proud to announce that I already knew about this feature. However, it is a good thing to have for those who don't. Thanks for the video!

[branislav]

Funny how this video and another one you did appeared just as I needed this stuff! Thanks!

[alvaroprietovideos]

I love short videos! Thanks for sharing

[TheChodex]

This is quite possibly one of the best new features, it just solves so much headaches!

[shapelessed]

Sadly gap isn't as widely adopted as we'd like, so falling back to margins is a good idea for the time being... I had a problem with my mobile browser not implementing it, and it was 3 relases behind...

[jakeblake]

How come I never heard of this in all my developing career😢😭

[lauris]

I really like theese very short videos. Good content. Css is so damn hard when u start to do more complex animations with javascript + css .

[dkaraush]

it doesn't work in older safari
I used this feature a lot but after I realized that, it was quite a dizaster. I finished with own solution to put <style> with two set of margins of children, just to replicate the same "gap" style behaviour.

and no, I can't just tell people to upgrade their browser

[jazzymichael]

Is this where the clothing store got their name?

[lordrandom]

I knew about gap but i didn't know column and row gaps existed this is so much better

[pankichal]

Gap is one of the best css properties.

[ay-at]

You are awesome!!!
Thanks from Egypt

[TheNeel]

You only use Grid and flexbox combo for large layout purposes, for children and minor design one should use flexbox

[baptistikenna]

Thanks for the video sir
please can you make one on
grid-column and not
grid-template-columns
Thanks 👍🏿

[jorims]

Using the gap property is soo Mich better than margin. It prevents these weird offsets that you encounter with the very first flex item or at the point where the item wraps.

[HDAllGames]

Gap is really good, while working with flex or grid, haven't been using much margin lately