This is when technical skills meet teaching skills.

I love how articulate you are. No umming and ahhing. Nice, precise content. Thank you.

@lyingcat9022

3 жыл бұрын

Greg Brown she was a teacher sooo.... ;)

@sallylauper8222

3 жыл бұрын

She explains things in a very understandable way. I think she should give more actual code examples though.

You just accelerated my understanding of CSS one hundred fold. Your ability to teach in a clear and concise manner is uncanny.

You can only explain at this level and make people understand it easier if you are directly involved in working groups 🤷‍♂️ Jen is the bestest of bests 🙌🙏

How could there be even one dislike? This is possibly the best overview I’ve ever seen... super clear and concise, and her delivery style is so cool. I’m now a fan.

Superb! This is what I've been missing from other tutorials. Great job!

This is the best explanation of the overall concept of Grid usage and how flexible it is.

You clearly understand this in your core. No cuts, just wonderfully clear. Thanks! I'm coming to learn grid before really having much experience with flexbox so I want to learn both and make informed decisions on my future layouts. You've helped me a lot already.

Your videos on CSS Grid are by far the most thorough and helpful that I've come across. Thanks for your efforts in making these videos!!!

@LayoutLand

6 жыл бұрын

You are welcome!

I'm totally amazed by this lesson. Super clear, super articulate. Very speculative. And no distracting procrastinate explanation. ❤️❤️

I was struggling to understand these concepts and you in 15:00 minutes just cleared it all. Thanks, Jen, you're amazing!

This is such good stuff. I love the way you combine a deep expertise with a learned practicality.

Thank you very much, a very complete and professional explanation, your English is very fluent and well pronounced for those of us who are learning this beautiful language.

Without a doubt the best CSS grid explanation ever.

These videos are fantastic! By far the most concise and easy to understands explanation of any programming concepts I have ever seen. Thank you Jen!! :D

I love all your videos. Very calming, relaxing & soothing while teaching. And the way you explain things makes me want to learn more. :) ALL your videos are the best explanation ive ever found on the internet. Thank you.

@LayoutLand

6 жыл бұрын

Oh, thank you.

I dont know how your videos started showing up in my suggested section, but I am so thankful they did. You explain CSS Grid amazingly!

Jen, thank you for explaining it so well and for your awesome narrative style! I came here after watching the wonderful Rachel Andrew’s vids which made me start using the grid. But then you add so much necessary depth and reasoning!

The quality of this video is exceptional. Truly A1 content! Thank you

You are the best teacher. I’ve watched many videos and you are the one I recommend to friends. Thank you!

Im just getting my head around grid and the more time passes the more I enjoy this woman talking. Shes very good at explaining the subject.

Big thanks! I like your way of explaining "How to do" and talking clear language. Super easy to understand each word. Well deserved SUB!

Great explanation of the grid. It all makes perfect sense. Thank you!

Thank you Jen. I had to jumpt to your site(s). I came for CSS, I stayed for you. I'm impressed, intrigued, and undeniably smitten. I'm surprised and somewhat taken aback that you are in NYC during the pandemic years. Frisco is awesome, my heart will always be NYC, my location is the Midwest. My career spans back to 1996. Not as illustrious, some speaking, etc... Yeah, there you are, thanks for this, good stuff. I'd love to have dinner, go for a walk in Central Park and/or the pier in Frisco, name it, I'm there. LOL, I'm going to bed, been at it since 4am and it's 9pm now. You are lovely, talented, intelligent, and, and and... LOL, I know, it's not a dating website. Thank you Jen and I hope you are fairing well in my favorite city on this planet. Hopefully we'll see the end of this thing in the near future.

Thank you so much for this explanation. I have been using flexbox and have been having a hard time getting layouts like I want them. Excited to get started with CSS Grid!

Amazing presentation!!! I'm learning web development and this has been the best explanation of GRID that I have found so far!

Simple and crispy info. Thanks! Appreciated your efforts ☺️.

I needed one tiny bit of information that was not covered anywhere else. I got it from this video. Thank you!

Being self taught. Trying to figure out floats and displays was frustrating. You fix one thing and something else breaks.Grrrr! This grid stuff has opened a whole new world for me. I might even be able to make a career out of it one day!Thank you for your time and explanation. They need a two thumbs up for videos like this!

wow this is very well explained. you make it understandable while still being very concise. thank you for the content

Fantastic Jen. As always!

Thank you for making the grid so easily digestible!!! Subbed!

Thank you for being precise, concise and none of that annoying & useless "ahhh" or "ummm" none sense. You remind me of a Jen I met in 1991 at Keesler AFB in Biloxi, MS. Very intelligent and helpful.

Thanks a lot Jen! A perfect entry for me. I need to learn how you do it, that it fits for all browsers without a ton of media queries. I like that. Thanks for sharing. Have a good time.

I love that this doesn't have any css property! It's a blessing not trying to memorize properties but only concepts that will be explored thoroughly in a second moment! Thanks!!!!

Glad I found this channel!! Thank you for your clear explanations 😀😀

Excellent introduction on the matter. Thanks!

Excellent explanation, I wish I would have seen this at the start of my CSS grid adventure! Thank you.

Thank you!!! So much! New to CSS after learning some HTML back in the late 90's. I've been so confused, and more confused the more I read. FINALLY it makes SENSE! I'm with ToughCandy. Mozilla give her a raise! Jen you are amazing.

Very nice explanation, technical and simple to follow, thanks so much!

You are a real teacher. Million thanks!

Jen, you are a GEM. Thank You!

You have such a great way of explaining exactly what you need and why you need it. Outstanding!!! --Pixie

One of the best channels. Please, come back with the videos

Thanks Jen! This was really insightful and elaborate.

One of such person, who knows stuff in detail.

Thank you so much. This is the best tutorial I've ever seen about Css stuff. It is really usefull and I want you to keep teaching and make videos about Css.

This is the best explanation of a grid.

Being able to style the empty grid cells would be awesome (I love visible grid lines) - hope Grid level 2 does give us this ability!

Great video and good explanation. One tip: raise the volume, have someone check the levels.

Awesome - articulated so clearly - so eloquently - thank you :)

She is gold ! I wish she shares more information about other topics too.

This is great explanation for HTML layout and how it works.

This helped my understanding so much!

That was really really nice, deep and useful video!! THANKS A LOT!

Liked & Subscribed. This is what quality content looks like.

i first found Jen on Mozilla's channel... so glad i found this thru other searches... thanks for the explanations Jen...

oh wow! 🙌🏼bless! clearest intro ever! yes, give this woman a raise :D!

Outstanding tutorial, I learned a lot, thank you!

I'm bad at search because I can't believe I've not run across your content yet. I can't recall such efficient use of words during an explanation. Until now, I never realized how many unnecessary words are jammed in the cracks between sought information in the other tutes I frequent. If your video is titled "css grid," 99% of your words are about css grid. Very refreshing for idiots like myself.

Great videos! Please post more!

this playlist is amazing

I was your student on linkedin learning :D hello teacher, glad to see you again

Wow didn't know about these videos, thanks Jen!

Excellent explanation, good job!

Thank you SO Much Jen.

Great explanation! You mentioned trying to get an orange line down the left - you could add a "border-left:solid 3rem orange" style element to achieve something like this. (Answering a long time after the video went live so things may well have progressed by now!)

Great job!!! Thanks Jen!!!

Very well explained. Thank you.

I could listen to you, explaining for ages..

Best explanation ever!

Best teacher! Thanks a lot.

Jen is amazing

Excellent teacher.

I like the way you explain. I get the vibe that few of the points were on the spot and I guess that's why you didn't include the slides for those.

Thanks! Great info!

It looks like you've done it. You're so amazing

Great job!

jen this is awesome, greeting from argentina! ♥

So helpful!

you make excellent videos, I can see why you have so many subscribers

Thank you for the explainer

wow Thank you very much for explaining

These are some of the best videos I have come across on any technical topic -- extremely clear delivery and they cover the content at a good pace. But the suggestion to use a element as a generic container is nasty from a semantic point of view and not something I would expect from an educator in this field!

Fantastic!

Love Jen

Excellent thanks.

What's the impact of using "display: contents" on the "only direct children are grid items" model? What would the performance implications / trade-offs be between using a nested grid that matches the parent vs up-jumping grandchildren to the children?

@LayoutLand

6 жыл бұрын

Ah! Yes. `display:contents` is a way to take a grandchild and make it into a child. For example, you have ... ul {display: grid;} makes the into a Grid container. the s are all the list items. By default, that image cannot be placed on the grid. If you .foo {display: contents;} then suddenly, it's like the doesn't exist (for CSS purposes), and the image now acts like it's a direct child of the Also, if you have any formatting on .foo - like a border, that will disappear as well. It's like li.foo doesn't exist to CSS. It's a great tool. But doesn't fully meet the needs of subgrid. Also, sadly, it's not well implemented in browsers yet, and there's no easy workaround for not having it.

Programming tutorials on youtube would be so much more enjoyable if Jen was doing them. Just so informative without making you feel intimidated. Bravo.

Thanks to you I went from never having made a single grid, to figuring it out and making one, without having to read another lame tutorial...THANK YOU!!

Am new to grid, and in this video had a couple of "ahhhhhh!" moments. Very well explained, thanks!

@LayoutLand

6 жыл бұрын

I'm glad it helped! I'm thinking of doing a more in-depth series on CSS Grid. Let me know what else would help to learn the whole thing.

@GrymligastPS4

6 жыл бұрын

Sorry i've been on holiday! I notice i've got a few new Grid vids to catch up on. If i come across anything in my Grid travels I will add a reply to your latest videos :) Thanks again.

This is great

Ahhh explained well....i've just started to transition and i'm used to heavily nesting. This makes sense.

No wonder she works for Apple now! this vid is a very solid reference, thank you very much!

amazing videos :o

There's something that bothers me a lot these days since I'm very new to web dev (I started learning in January, with no prior knowledge on the subject matter). And I found myself confronted to a lot of things going on, I mean I feel like I'm in a middle of a huge shift right know, sometimes I start thinking that it's maybe not the best time to do it, then after doing a lot of research I've discovered that It's never a good time to do it if I look at it from that perspective, since it's evolving in a pace where no one can find the perfect spot to start with...bottom line: Do It, and start now!! Everyone have felt or will feel the same way when starting to code for sure!! Now my question is: Experimented people always suggest that we need to know the basics, and it's something that I agree with, but when it comes to new things, do we need to go through the old stuff?, I mean do I really need to know about the float based layout techniques and frameworks Or I move on and work with a newest and easiest technique ? In other words, witch is better : learn CSS Grids without putting the old stuff in your mind? Or learn the old stuff (basics) and then "purge that out of your mind" and work with CSS Grids? ps: I love your vids they're very informative! THANK YOU!

@alisamuzafarova4131

6 жыл бұрын

As someone with over 10 years of experience I'd advise, as you look into LAYOUT 1) learn flex box first 2) learn CSS grid second or at the same time; 3) read about float but SKIP all "float layouting knowledge", as it is indeed outdated and was a hack; it's still very much useful to learn all display modals developer.mozilla.org/en-US/docs/Web/CSS/display (the basics of how DOM elements flow)

@aminemakhlouf5283

6 жыл бұрын

Alisa Muzafarova Thank you so much for the reply, finally a sincere answer, no one is using the word "skip" anymore as though they've been through the whole process since the 80's or so..Thanks again..have a great day.

@TheDonBry

6 жыл бұрын

i also had the same problems thank you for the reply, it give me some ideas

@AmieB2005

5 жыл бұрын

Alisa Muzafarova I'm also very new to this so I don't really understand how accepted or "best practice" is the Grid model or any layout model. Everywhere I hear is that accessibility comes first, and if a fairly new feature is still not accepted by a user in Cambodia using a 2008 browser, you shouldn't be using it.

Good stuff

Can you please detail or show example how we can make the last part you talked about happen? I am trying to do exactly that, have some sprt of color scheme or stripe run down or across or maybe even diagnol but can't seem to find a way using grid that will also be responsive. Plz plz plz

Hi, I am a newbie to coding and I wanted to know what is a b element and do you have an example of it but I loved the discussion on CSS Grids. I wanted to include that into my project using the CSS GRIDS.

I was a little confused when you explained that only direct children of the container are placed on the grid and that children of those are not placed on the grid. I was interpreting "not placed on the grid" too literally. I now believe I understand what you said to mean that only direct child elements of the container can be items and have item-specific css attributes and their children will be placed on the grid but not as items but rather as the item's content. I tried making a grandchild element an item and the browser rendered the parent of the grandchild as an anonymous (implicit) item and its child (the element upon which I actually placed grid-row and grid-column attributes on) as the anonymous item's content. I think your videos and presentations are awesome. Watching them has reignited my love for web development after having walked away from it a few years back due to illness. Thankfully I am 100% well now and dying to get back into the game and in large part that is because of you. Thank you so much.

@LayoutLand

6 жыл бұрын

This is very helpful feedback! You are right, I could explain how the flow works to put all grandchildren+ onto the grid as a child of a placed item. Yup. I'm glad you figured it out.

@catwhisperer911

6 жыл бұрын

CSS grids are awesome and your videos have convinced me to use them :)