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

CSS Grid Tutorial #6 - Aligning & Justifying Items

438 ratings | 19226 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 (27)
Ali Nawaz (21 days ago)
amazing tut man you are great
Ruslan Agaev (3 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 (3 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 (4 months ago)
Imagine using CSS Grid with Flexbox. (Mindblowing)
ihab s (4 months ago)
You make everything easier and wonderful....
Avinash More (7 months ago)
Best tutorials i have ever gone through.. @ninja Thanku u ..
Michał Ratajczak (7 months ago)
Absolutely fantastic tutorial!
Matthew Davies (8 months 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 (8 months 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 (8 months ago)
simple as that, congrats !
arslan rashid (9 months ago)
Your way of explaining the things is just awesome bro, keep it up..:-)
Adrn Amrfs (10 months ago)
Glad he got rid of the Bruce Lee noise at the beginning/
Shabriel (6 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 (9 months ago)
It actually used to scare me when i used headphones....:D
Avis Guptz (11 months 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?
TheSabatuer (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 (2 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
Tianchi Xu (3 months ago)
Check https://caniuse.com
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?
Royal clashers (1 year ago)

Would you like to comment?

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