The :empty pseudo selector will select elements that contain either nothing or only an HTML comment.
div:empty { display: none; }
Will Match
<div></div> <div><!-- test --></div>
Will Not Match
<div> </div> <div> <!-- test --> </div> <div> </div>
It’s useful for hiding empty elements that might cause weird spacing (e.g. they have padding). Or something like removing the border from the top left table cell element in a cross-referencing table.
Browser Support
Chrome | Safari | Firefox | Opera | IE | Android | iOS |
---|---|---|---|---|---|---|
any | 3.1+ | 1.5+ | 9.5+ | 9+ | ? | ? |
Leave a Reply