Select first occurring element after another element

Question

I've got the following HTML code on a page: ```

Some text

Some more text!

``` In my `.css` I've got the following selector to style the `h4` element. The HTML code above is just a small part of the entire code; there are several `div`s more wrapped around belonging to a shadowbox: ``` #sb-wrapper #sb-wrapper-inner #sb-body #myDiv h4 { color : #614E43; margin-top : 5px; margin-left : 6px; } ``` So, I have the correct style for my `h4` element, but I also want to style the `p` tag in my HTML. Is this possible with CSS-selectors? And if yes, how can I do this?

Accepted Answer

```
#many .more.selectors h4 + p { ... }
```

This `+` is called the adjacent sibling selector.

Adjacent sibling selectors have the following syntax: E1 + E2, where E2 is the subject of the selector. The selector matches if E1 and E2 share the same parent in the document tree and E1 immediately precedes E2, ignoring non-element nodes (such as text nodes and comments).

Select first occurring element after another element

Solution

Problem