Relationships Between Elements

Web Development Front-End
1

In a code, if two or more elements have different parents but are on the same level, are they still considered siblings? If not, what is the relationship between them?

<body>
     <div>
          <h2>About Brown Bears</h2>
     </div>
     <div>
          <h2>Habitat</h2>
      </div>
</body>

*Code above is only used as an example

2

The divs are siblings, the h2 aren’t.
You can still address them as kind of sibling with the :has() pseudoclass and the adjacent sibling selector:

div:has(h2) + div h2 {
  color: red;
}

Bildschirmfoto 2024-03-14 um 20.30.16

2 Likes