Ronalds Vilciņš

Riga, Latvia

CSS :empty Selector

The CSS :empty pseudo-class selects any element that has no children or text.

/* Background color of every empty div element */
div:empty {
  background-color: #000;

  <p>Some text</p>

  <!-- No text, background #000 -->

MDN’s definition:

The :empty CSS pseudo-class represents any element that has no children. Children can be either element nodes or text (including whitespace). Comments, processing instructions, and CSS content do not affect whether an element is considered empty.

See also