9 Biggest Mistakes with CSS Grid

It's easy to make lots of mistakes with a new technology, especially something that's as big of a change from the past as CSS Grid. Jen lists the 9 Biggest Mistakes she sees people making when using CSS Grid, with advice and tips for avoiding these pitfalls and old habits.

Mistake 1: Thinking CSS Grid is Everything

Mistake 2: Using Only Percents for Sizing

Mistake 3 : Assuming You Need Breakpoints

Mistake 4: Getting Confused by Numbering

Mistake 5: Always Using 12-columns

Mistake 6: Ignoring the Power of Rows

Mistake 7: Reaching for a Framework

Mistake 8: Waiting for IE11 to Die

Mistake 9: Hesitating, Instead of Playing

[roeltz]

Jen is an unique speaker. She does not only explain very technical stuff very simply, but she also brings her own ideas and experiences from a more creative standpoint to inspire others.

I think I'm in love with her.

[natashagonzales]

I just wanted to take a moment to thank you. I originally got into graphic design, but fell in love with code so decided to pursue web design. But website designs have seemed really... stuck for awhile. A box here another box there and for someone who loved the artistic side of design, it started to get really discouraging. Everyone would go on about how this is just the way the web should work, and I had a hard time feeling excited about designing websites and imagining my place in the industry. Finding your videos, hearing someone who's done this for so long and is so prolific in the community talk about building beautiful websites, challenging us to really push ourselves, it's truly reinvigorated me. Thank you.

[devKazuto]

I use Grid even with IE not supporting it. I just don't support IE xD

[codecobber]

Simply put . . . You are a legend. I tried CSS Grid back in 2017 but decided to leave it until the browsers caught up. Now in 2020, I'm jumping back in. Your advice in invaluable, your comments insightful. Thank you for the videos.

[emartin]

she explains things like were both stupid. I love it!

[kingscrusher]

You are brilliant. I am now a follower of this channel. Thank you so much. You have great artistry, experimentation, and insights. Thanks so much.

[TytusDubel]

wow..Madamme, you're really straight and clean: i'm a newbie [is it correct??] in the css world and generally speaking, web. I'm a graphic designer, yes, this i can say, as i'm used to be ready to print out the things, but the web, it's such a hard piece of cake..when i saw grid it was like wow, but obviously, not knowing things, makes it complicated. You made me more calm, i see that the path of css is like adding a new possibility to what was been already done: ok, we had Flex, now, a Grid, for some reason. So, as i understand, we don't throw in the bin the other, but simply, aggregate a new "technique" to our system of working. So to say, in my lab [i just make an out loud reasoning of my own process] we have vectors and rasters: they both exist, we can't say one is better than the other. They ARE. :- D Happy to understand more new things, and definitely i'll follow your thoughts, as you instantly gave me the impression of a Wise Person, not only about the tecnica topic, but, further than that, overall.. [ hope it make sense in english].

Thank You for the video, i really appreciated it!

Tytus.

[JamesKing-jcuy]

I love the fact that you talk to us today about bloody everything! I'm sure you're rocking' the big times in our field - art/dev/leadership. But I wouldn't have learned CSS and Flex without your sympathetic and really cool wise help. Thanks a million Jen. You also have a really soothing voice, perfect teacher, thank you!

[jrgenbrix]

"Please don't use a framework - do some vanilla css yourself" - that settles it, I officially love you! :-)

[keithpurtell]

Another perfect tut from Jen. Not a stiff lecture. It's like sitting in a comfortable room listening to a really interesting sr dev who wants you to succeed.

[digigoliath]

Great video! I am no designer and a complete newbie to CSS (mere weeks old). But wow, I love it when we can get into a master designer's head where the discussion is not so much about the tech and all about innovative ideas humanly imaginable. More videos please!! The presentation is wonderful too! 9:16 is GOLD!

[PCHelpNews]

As a beginner and hobbyist dabbling, , Jen inspires me to learn CSS Grid. I can't stop watching your videos and only hope I will be able to design with Grid.

[visulliv]

YES! love the 'replacement mentality' explanation.

[TaberIV]

I'm graduating with a computer science degree this year, and I'm a solid programmer, but always found CSS frustrating. This channel helped make all of it make so much more sense and I'm managing to make webpages that don't _just_ work, but also look nice!

[kandysman]

I've been learning Html, CSS and javascript my own for 2 months now, and i have no idea how I've missed your content. You are a lifesaver. This channel is what I've needed most.

[TorBruheim]

You are the best. Thank you. Never stop making these videos. You saved us from an huge amount of extra work.

[mathws]

I completely agree with Jen, front-end frameworks are a great starting point but sometimes you just get to a point where you don't need them anymore. Writing your own style guide that is tailored to your app makes so much more sense.

[xmlthegreat]

If Jen could do a Full Stack video series, that would be nice. Her teaching style is energetic instead of dull and flat.

[RedEyedJedi]

Use floats when you want the text to float around an image the way it does in print. That's what it was designed for and it does that well.

[jakemetz]

How good is Jen tho 👏. Thank you for the extra effort you put into organizing the description along with linking to further content.