CSS :only-child Pseudo Class - Playground Example

<!DOCTYPE html><html><head><style type="text/css">/* Target any <p> element that is an only child */
p:only-child {
  background-color: #e1f5fe;
  color: #01579b;
  border: 2px solid #01579b;
  padding: 15px;
  border-radius: 8px;
  font-weight: bold;
  text-align: center;
}

/* General container styling for layout */
.container {
  margin: 20px 0;
  padding: 10px;
  border: 1px dashed #ccc;
}</style></head><body><div class="container">
  <p>I am the only child here. I get the special styling!</p>
</div>

<div class="container">
  <p>I have a sibling...</p>
  <p>...so neither of us are "only" children.</p>
</div></body></html>