DEV Community

Sham Gurav
Sham Gurav

Posted on

:empty Selector In CSS

The :empty CSS pseudo-class represents any element that has no children. Children can be either element nodes or text (including whitespace).

HTML Code -

<div> Hello World !!!</div>
<div> <!-- Empty --> </div>
<div> GoodBye World !!! </div>
Enter fullscreen mode Exit fullscreen mode

CSS Code -

div:empty {
     background-color: #ff0000;
}
Enter fullscreen mode Exit fullscreen mode

Output -

:empty Selector Demonstration

Top comments (0)