HomeОбразованиеRelated VideosMore From: The Net Ninja

CSS Grid Tutorial #6 - Aligning & Justifying Items

548 ratings | 26052 views
----- COURSE LINKS: + Atom editor - https://atom.io/a + GitHub Repo - https://github.com/iamshaunjp/css-grid-playlist --------------------------------------------------------------------------------------------- Other tutorials: ----- HTML FOR BEGINNERS: https://www.youtube.com/watch?v=Y1BlT4_c_SU&list=PL4cUxeGkcC9ibZ2TSBaGGNrgh4ZgYE6Cc ----- CSS FOR BEGINNERS: https://www.youtube.com/playlist?list=PL4cUxeGkcC9gQeDH6xYhmO-db2mhoTSrT ----- NODE.JS TUTORIALS https://www.youtube.com/playlist?list=PL4cUxeGkcC9gcy9lrvMJ75z9maRw4byYp ----- SUBSCRIBE TO CHANNEL - https://www.youtube.com/channel/UCW5YeuERMmlnqo4oq8vwUpg?sub_confirmation=1 ============== The Net Ninja ===================== For more front-end development tutorials & to black-belt your coding skills, head over to - https://www.youtube.com/channel/UCW5YeuERMmlnqo4oq8vwUpg or http://thenetninja.co.uk ================== Social Links ================== Twitter - @TheNetNinja - https://twitter.com/thenetninjauk
Html code for embedding videos on your blog
Text Comments (31)
Dalibor Petrić (14 days ago)
2 years of video existing on Yt and no dislikes so far. This is good. :D
Bob Wilson (1 month ago)
Again... BRILL
Arasto Sahbaei (2 months ago)
not all heroes wear capes..
Haris Ghauri (2 months ago)
I used to be so much scared of CSS and front-end development, in general. Your tutorials have helped me alot! I can not thank you enough!
Lasith K (2 months ago)
Could anyone explain to me the use of align-content instead of align-items?
Ali Nawaz (4 months ago)
amazing tut man you are great
Ruslan Agaev (7 months ago)
I’ve been watching so many videos about grid system . However , I finally understood how it works by watching this videos .
Peter Dobson (7 months ago)
Aligning and justifying grid locations. .one .two. Need to give it the DIV an ID tag 1st surely? That's the only way it worked for me. Obvious perhaps? Being new to CSS could be why. UPDATE: rewatched I see you had already "classed" it out. Doh!!
Samuel Pimenta (8 months ago)
Imagine using CSS Grid with Flexbox. (Mindblowing)
ihab s (8 months ago)
You make everything easier and wonderful....
Avinash More (11 months ago)
Best tutorials i have ever gone through.. @ninja Thanku u ..
Michał Ratajczak (1 year ago)
Absolutely fantastic tutorial!
Matthew Davies (1 year ago)
Does the grid layout have an effect on absolute and relative positioning of extra items that you want to add? For example a text overlay that will appear on an image hover?
Grezz (1 year ago)
Oh my god! Finally a simple way of aligning text to the centre of divs! I no longer have to prat around with display: table-cell, setting the Line height to match the div height, putting in special padding rules like calc(50% - 1em), or translateY. Thank you! Viva la Grid!
Alexandru Aprodu (1 year ago)
simple as that, congrats !
arslan rashid (1 year ago)
Your way of explaining the things is just awesome bro, keep it up..:-)
Adrn Amrfs (1 year ago)
Glad he got rid of the Bruce Lee noise at the beginning/
Shabriel (10 months ago)
Bruce Lee made a scary sound. He also made the slam sound at the start less loud. I appreciate both of these changes.
arslan rashid (1 year ago)
It actually used to scare me when i used headphones....:D
Avis Guptz (1 year ago)
Short and to the point..... your channel is what I have been looking for..... you just got a subscriber
Don De Leva (1 year ago)
I really want to start using Grid and Flexbox. Should I build 2 style sheets?
Albert Mars (1 year ago)
can u make a series of gatsbyjs after this one shaun?
Brendon (1 year ago)
Love the videos. Keep it up!!
Andrey Kozubenko (1 year ago)
Thank you for your lesson. Will you plan to show how to make fool page (landing for example) with header, footer and content inside?
TheSabetuer (1 year ago)
As a frontend developer for 9 years, CSS Grids just gave me a boner! Started from <center> to tables, to floats to boxmodel to flexbox and now this. CSS has come a long way for sure. So hows browser support doing for this method now? Are we gonna have to use hax for unsupported browsers and stuff?
Ricky Bee (6 months ago)
All browser support this so good now photoshop slices should look great. there are a few hacks but not for layout, just for fews
MrCamjames (1 year ago)
I know I'm late, but you didn't get an answer, soooooo. I say "unsupported", you say "IE". In all seriousness, I think there's a -ms prefix to use an older version
Nice one. You should use codepen for this vids, so you won't have to switch screens all the time..
Cristian Castaneda (1 year ago)
I'm expecting this today! Great tutorials, Thanks!
kaung san (1 year ago)
Master How do you learn all these staffs ? Can u make a tutorial on that?
Rishabh Shukla (1 year ago)

Would you like to comment?

Join YouTube for a free account, or sign in if you are already a member.