:only-of-type CSS Pseudo Class
Description
The :only-of-type
pseudo-class is applied to the child of the specified type only if it is unique to the parent.
Syntax
element :only-of-type { ... }
Example
<main>
<div>I am 'div' #1.</div>
<p>I am the only 'p' among my siblings.</p>
<div>I am 'div' #2.</div>
<div>I am 'div' #3.
<i>I am the only 'i' child.</i>
<em>I am 'em' #1.</em>
<em>I am 'em' #2.</em>
</div>
</main>
main :only-of-type {
color: red;
}
Browser Support
Desktop | |||||
9 | 12 | 1 | 3.5 | 9.5 | 3.2 |
Tablets / Mobile | |||||
![]() |
|||||
2 | 18 | 4 | 10.1 | 3.2 | X |
Last updated by CSSPortal on: 25th November 2019
CSS Pseudo Elements
CSS Pseudo Classes
- :active
- :checked
- :default
- :disabled
- :empty
- :enabled
- :first-child
- :first-of-type
- :focus
- :fullscreen
- :hover
- :in-range
- :indeterminate
- :invalid
- :lang
- :last-child
- :last-of-type
- :link
- :not
- :nth-child
- :nth-last-child
- :nth-last-of-type
- :nth-of-type
- :only-child
- :only-of-type
- :optional
- :out-of-range
- :read-only
- :read-write
- :required
- :root
- :target
- :valid
- :visited