Collapse Empty Div

by Patrick Hund

HTML

<p>Cocolate colored div is invisible, because it is empty (using :empty CSS selector)</p>
<div class="lime">singen</div>
<div class="hotpink">tanzen</div>
<div class="chocolate"></div>
<div class="gold">lachen</div>

CSS

body {
    font-family: Helvetica Neue;
}
.lime {
    background-color: lime;
}

.hotpink {
    background-color: hotpink;
}

.chocolate {
    background-color: chocolate;
}

.gold {
    background-color: gold;
}

div {
    padding: 10px;
    margin-bottom: 10px;
}

div:empty {
    display: none;
}