Ronalds Vilciņš

CSS :empty selector

The :empty selector in CSS is used to select elements that have no children, either element nodes or text nodes.

Here’s an example of how you might use it:

div:empty {
  background-color: lightgray;
  border: 1px solid gray;
  height: 50px;
  width: 50px;
}

This will apply the specified styles to any div element that has no children.

You can also use the :empty selector in combination with other selectors. For example:

.container :empty {
  background-color: lightgray;
  border: 1px solid gray;
  height: 50px;
  width: 50px;
}

This will apply the styles to any element that is empty and is a descendant of an element with the class container.

Note that the :empty selector only selects elements that have no children. If an element has text nodes that only contain white space, it will not be selected.