This page is part of the CSS3.info CSS selectors test. See more info on CSS3 selectors.
div :only-child {
}
<div>
<div></div>
</div>
The CSS selector should match the inner div element, because it is the only child of the outer div element
div :only-child {
}
<div>
<div></div>
<!-- Just a comment -->
</div>
The CSS selector should match the inner div element, because it is the only child of the outer div element
div :only-child {
}
<div>
<div></div>
How about regular text...
</div>
The CSS selector should match the inner div element, because it is the only child of the outer div element
div :only-child {
}
<div>
<div></div>
<blockquote></blockquote>
</div>
The CSS selector should not match the inner div element, because it not the only child
div :only-child {
}
<div>
<div id='appendChild'></div>
</div>
var ib = document.getElementById('appendChild');
ib.parentElement.appendChild(document.createElement("div"));
The CSS selector should not match the original div element, because it is not the only child anymore after another child is append by the Javascript code.