This page is part of the CSS3.info CSS selectors test. See more info on CSS3 selectors.

1. div:only-of-type {
   }
   
   <div>Does this element match?</div>

   The CSS selector should match the marked div element, because it is the only element of this type

2. div:only-of-type {
   }
   
   <div>Does this element match?</div>
   <blockquote></blockquote>

   The CSS selector should match the marked div element, because it is the only element of this type

3. div:only-of-type {
   }
   
   <div>Does this element match?</div>
   <blockquote>
      <div></div>
   </blockquote>

   The CSS selector should match the marked div element, because it is the only element of this type in this scope

4. div:only-of-type {
   }
   
   <div>Does this element match?</div>
   <div></div>

   The CSS selector should not match the marked div element, because it is not the only element of this type

5. div:only-of-type {
   }
   
   <div id='appendChild'></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 of its type anymore after another child with the same type is append by the Javascript code.