The :empty selector matches every element that has no children.
Comments or processing instructions do not affect whether an element is considered empty or not.
Comments or processing instructions do not affect whether an element is considered empty or not.
Code:-
<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=device-width, initial-scale=1">
<style>
div:empty {
width: 100px;
height: 100px;
border: 2px solid black;
background-color: green;
}
div:not(:empty) {
width: 100px;
height: 100px;
border: 2px solid yellow;
background-color: red;
}
</style>
</head>
<body>
<div>
Have content
</div>
<!--The following div not Empty div because empty space are there-->
<div>
</div>
<!--The following div is empty div-->
<div></div>
<!--The following div is also empty div, because the comments are not consider-->
<div>
<!--This is empty div-->
</div>
</body>
</html>
Css:- empty selector
Reviewed by Network security
on
May 23, 2019
Rating:
No comments: