The adjacent sibling combinator (+
) separates two selectors and matches the second element only if it immediately follows the first element, and both are children of the same parent element
.
/* Paragraphs that come immediately after any image */
img + p {
font-weight: bold;
}
Syntax
former_element + target_element { style properties }
Examples
CSS
li:first-of-type + li {
color: red;
}
HTML
<ul>
<li>One</li>
<li>Two!</li>
<li>Three</li>
</ul>
Result
Specifications
Specification | Status | Comment |
---|---|---|
Selectors Level 4The definition of 'next-sibling combinator' in that specification. | Working Draft | Renames it the "next-sibling" combinator. |
Selectors Level 3The definition of 'Adjacent sibling combinator' in that specification. | Recommendation | |
CSS Level 2 (Revision 1)The definition of 'Adjacent sibling selectors' in that specification. | Recommendation | Initial definition. |
Browser compatibility
The compatibility table on this page is generated from structured data. If you'd like to contribute to the data, please check out https://github.com/mdn/browser-compat-data and send us a pull request.
Update compatibility data on GitHub
Desktop | Mobile | |||||||||||
---|---|---|---|---|---|---|---|---|---|---|---|---|
Adjacent sibling combinator (A + B )
|
Chrome
Full support 1 |
Edge
Full support 12 |
Firefox
Full support 1 |
IE Full support 7 Full support 7 Notes' Internet Explorer 7 doesn't update the style correctly when an element is dynamically placed before an element that matched the selector. Notes' In Internet Explorer 8, if an element is inserted dynamically by clicking on a link the first-child style isn't applied until the link loses focus. |
Opera
Full support 3.5 |
Safari
Full support 1 |
WebView Android
Full support ≤37 |
Chrome Android
Full support 18 |
Firefox Android
Full support 4 |
Opera Android
Full support 10.1 |
Safari iOS
Full support 1 |
Samsung Internet Android
Full support 1.0 |
Legend
- Full support
- Full support
- See implementation notes.'
- See implementation notes.
See also
Adjacent sibling combinator by Mozilla Contributors is licensed under CC-BY-SA 2.5.