title: Hide a whole div with CSS with part of it is empty
body: <p>Is there a way to hide a whole div if part of it is empty? For example if "dd" is empty as shown below can I hide the whole class "test" so the keyword Restrictions does not show either. I tried .test dd:empty { display: none;  } but this does not work. thanks!</p>
  
  <p><div class="snippet" data-lang="js" data-hide="false">
  <div class="snippet-code">
  <pre class="snippet-code-html lang-html prettyprint-override"><code>  &lt;div class="test"&gt;&lt;dt&gt;Restrictions:&lt;/dt&gt;
    &lt;dd&gt;&lt;/dd&gt;&lt;/div&gt;</code></pre>
  </div>
  </div>
  </p>