Categories
Web development

CSS :empty Selector

CSS :empty selector

CSS :empty selector

The CSS :empty selector selects every element that has no children.

Syntax:

:empty {
  CSS declarations;
}

Example:

<!DOCTYPE html>
<html>
<head>
<style> 
div:empty {
  width: 220px;
  height: 20px;
  background-color: #2a9d8f;
}
</style>
</head>
<body>

<div></div>
<div>This is some text in a div element.</div>
<div>This is some text in a div element.</div>

</body>
</html>

Output:

This is some text in a div element.
This is some text in a div element.

Enjoy coding!