this video would have been a great way of showcasing the `grid-template` shorthand. it makes the whole "defining the grid" a lot more visual and you don't need the weird `grid-template-area: unset` because the shorthand overrides it for you.
Transitioning w the fr unit- i know ive transitioned rows from 0fr to 1fr but im curious what the exact constraints are if 50px to 1fr didnt work correctly. Or maybe mine just looks like it works and it wouldnt be able to do a reverse infunite animation 🤔 Love the grid series! Wonder if subgrid appreciation month is coming again ✨️
great video, grid is amazing, i am trying to incorporate grid lines more in my coding practices, difficult to find the right combination sometimes if the page gets too busy, or if trying to do in such a way as to avoid @media or @container type coding.
Since you mentioned it at the end: transitioning from 0fr to 1fr doesn't seem to work anymore in FireFox (it did before). I have to change 0fr to 0 in order for my Accordion to function properly which ofcourse means that it will jump between those values now. Haven't tested if the latest release fixed that, but I doubt it.
Absolute positioning of the grid item in conjunction with grid-columns / grid-rows only works if the grid container is position relative (or absolute or fixed). Unfortunately, this nuance appears to have been skipped in the video entirely.
Hii Kevin I join company as intern and I learn bootstrap 5 because we work on that and make website full responsive on every single website ...but I stuck and can't figure out how I can write smooth code with responsive using media query ....so can you make video on that ..... Please reply my question... Love from india ❤
I send email to you for BeyondCSS course, but get no reply, how can I get in touch with you. Sorry to comment here, but really don’t know how I can get it touch with you.
this video would have been a great way of showcasing the `grid-template` shorthand. it makes the whole "defining the grid" a lot more visual and you don't need the weird `grid-template-area: unset` because the shorthand overrides it for you.
One of these days 😂
I had no idea you could use absolute positioning along with grid, great tip!
Awesome tips and trick. loved all of them
Awesome video as always Kevin! Just checking, so do absolutely positioned items in a grid become grid-items themselves?
Great question! If the grid container is positioned, I guess so, yes, but I'd have to look at spec
I need all of these Grid-videos tog get my brain about learning them.
And yes, I like the new theme! Was thinking I wanted it for my own IDE.
I am really constantly improving my knowledge in CSS Grid. It is vast and diverse.
Great video, thanks. Really useful - I love the grid videos. And the new theme is good too!
Another awesome advanced tutorial! Keep'em coming and Thank you!
Transitioning w the fr unit- i know ive transitioned rows from 0fr to 1fr but im curious what the exact constraints are if 50px to 1fr didnt work correctly. Or maybe mine just looks like it works and it wouldnt be able to do a reverse infunite animation 🤔
Love the grid series! Wonder if subgrid appreciation month is coming again ✨️
This again an awesome video with the true powers of css grid. Thanks Kevin for these clear and good examples! 😊
Thanks Roland!
great video, grid is amazing, i am trying to incorporate grid lines more in my coding practices, difficult to find the right combination sometimes if the page gets too busy, or if trying to do in such a way as to avoid @media or @container type coding.
Great tips, being able to play with layouts like this is fantastic compared to the css layout mud wrestling we had to do 10 years ago
Since you mentioned it at the end: transitioning from 0fr to 1fr doesn't seem to work anymore in FireFox (it did before). I have to change 0fr to 0 in order for my Accordion to function properly which ofcourse means that it will jump between those values now.
Haven't tested if the latest release fixed that, but I doubt it.
thank you bro from Fiji
Great video as always. Really love your videos and watch them as they come out. I like the new theme, which one is it? Or custom?
You consistently make 1999 web designer me cry. (Thank you!)
Absolute positioning of the grid item in conjunction with grid-columns / grid-rows only works if the grid container is position relative (or absolute or fixed). Unfortunately, this nuance appears to have been skipped in the video entirely.
Awesome! This was really useful.
The absolute positioned items in grid areas is bonkers.
Great tips. Thanks.
The implementation of CSS can initially appear perplexing and counterintuitive, seeming more like a clever workaround than a straightforward feature.
That's awesome I didn't know that 😄 we can do this 💪.
wow, I learned a lot new stuff about CSS.
Thanks for showing.
Could you use, "CSS -- overflow: hidden;" to make the image float up and down and not subject lower layout items to unnecessary movement?
Not with how I'm animating this, but if I had only animated the image, then yes
you say don't animate your fr's, but your 0 to auto video you link to... is animating fr's???
isn't it transitioning not animation?
I didn't really understand or remember anything but it's a nice introduction
How would we animate the SVG car to move behind the transparent image?
Grid doesn't need to Flex!
🎉
Hii Kevin
I join company as intern and I learn bootstrap 5 because we work on that and make website full responsive on every single website ...but I stuck and can't figure out how I can write smooth code with responsive using media query ....so can you make video on that .....
Please reply my question...
Love from india ❤
can you kindly provide the codepen link for this ?
expand the topic Custom HTML Tags
Custom HTML Tags
wait, i'm confused. did you even need the position absolute for the car icon? like, wouldn't setting the grid-column/-row alone have the same effect?
except for top/left/… of course, but i think you could've used margin for that, right?
What vscode theme you use? thanks
Grid itself is underused
🤯
one dark pro?
I send email to you for BeyondCSS course, but get no reply, how can I get in touch with you. Sorry to comment here, but really don’t know how I can get it touch with you.
hello css boss
👋
“Another tip is z-index” no you don’t…
godamn I said goddamn!