CSS Combinators Simplified (with examples)

CSS Combinators allow you to select elements by combining multiple selectors. There are 4 types of combinators: Descendant, Child, Sibling and Adjacent. I simplify these combinators with examples in this video.

Timestamp:
00:00 Intro
00:31 What are Combinators?
01:16 Descendant Combinator
03:31 Child Combinator
05:03 Sibling Combinator
06:57 Adjacent Combinator

Useful links:

_____

_____

🌟 About Me:
Dillion Megida, creator of DEEECODE, is a Software Engineer, Developer Advocate and a Content Creator passionate about simplifying topics around Tech via articles and videos.

_____

⚡️ Connect with me:

_____
#deeecode

[waterman]

Hi, great video thanks. I'm just trying to get my head around this. I think I understand but I only understand because of your indentation.

So because the paragraphs at the bottom are in line with H2 they are siblings, but my question is how did you know to indent the last two paragraphs that far to the right. Why did you not put them on the left in line with the section tag?

And how did you know to indent the divs that far? Did you know when you wrote the code that you wanted the divs to be descendents of the section tag. Thanks for any help. I'm a bit confused!

[progressisrealchibuzornwad]

…can you do a video on responsive nav bar¿ Html and css only.
Thank you