CSS Sibling Selectors

This tutorial covers how to use the different types of CSS sibling selectors to more selectively target and style elements in your HTML.

[zahidurrahman]

Steve, you have an amazing accent for Asian subcontinent people to understand every single word you pronounce. you deliberately use this particular set of accent to make non-English speaking people understand your lecture. thank you very much.

[adamvanhorn]

Thank you for being so clear and even more so for not talking extremely fast and typing a million miles an hour. I find it so frustrating when a teacher just rushes through the information like the audience already knows the information.

[kamatz]

Thank you soo much!, I been looking for something like this for a while now and you explained it really well. You just got yourself a sub :))

[Azar]

Simple, clear and efficient.
Thank you

[andrew.schaeffer]

Love the succinct explanations. Great video as usual

[christianrosado]

why didnt p~p effect all P's ? @ 3:30

[shibrahmisbah]

Wow this was just perfect! I finally understand how to use them.

[mendistudio]

Simple and concise, thanks for sharing

[umeshchandraverma]

I want to change text color of h1 red
if mouse hover at h2
Without using JavaScript
means using html and CSS only

[qasimarthuna]

You made me understand so good love you and your content
Thanks👍👌

[muzhganhaidari]

thank u so much sir. waiting for next videos.

[AK-mysb]

i tried to make the 2nd paragraph colour using
p + p {
color: red'
}

but it did not work, why?

[sidokouki]

so in the general sibling not only it needs to be a sibling but it also need to be under ?
Ex : (div ~ p) the targeted p need to be UNDER his sibling div, right ?

[haithemabdelmoumenathmani]

which ones will change... just one of them (p) or both?

h1 ~ p {
color: green;
}

<h1> bla bla bla </h1>
<p> bla bla bla </p>
<div>
<p> okay </p>
<h1> okay </h1>
</div>