CSS :empty Selector
Last Updated :
29 Aug, 2024
Improve
The: empty selector is used to select that element that does not contain any children (including text node).
Syntax:
:empty {
/* CSS property */
}
Example: In this example, we are using the above-explained selector.
<!DOCTYPE html>
<html>
<head>
<title>empty selector</title>
<style>
h1 {
color: green;
}
div:empty {
width: 150px;
height: 20px;
background: green;
}
</style>
</head>
<body>
<center>
<h1>GeeksforGeeks</h1>
<h2>:empty selector</h2>
<div></div><br>
<div>A computer science portal for geeks</div>
</center>
</body>
</html>
<html><head> <title>empty selector</title> <style> h1 { color: green; } div:empty { width: 150px; height: 20px; background: green; } </style></head><body> <center> <h1>GeeksforGeeks</h1> <h2>:empty selector</h2> <div></div><br> <div>A computer science portal for geeks</div> </center></body></html>Output:
Supported Browsers:
- Apple Safari 3.1 and above
- Google Chrome 1.0 and above
- Edge 12.0 and above
- Firefox 1.0 and above
- Opera 9.5 and above
