title: Is there a valid way to wrap a dt and a dd with an HTML element?
body: <p>I wish HTML could do something semantically equivalent to this;</p>
  
  <pre><code>&lt;dl class="main-list"&gt;
      &lt;definitionitem&gt;
          &lt;dt&gt;Some Thing&lt;/dt&gt;
              &lt;dd&gt;You know it!&lt;/dd&gt;
          &lt;dt&gt;Another Thing&lt;/dt&gt;
              &lt;dd&gt;Word.&lt;/dd&gt;
      &lt;/definitionitem&gt;
      &lt;definitionitem&gt;
          &lt;dt&gt;Stuff&lt;/dt&gt;
              &lt;dd&gt;Alright!&lt;/dd&gt;
      &lt;/definitionitem&gt;
  &lt;/dl&gt;
  </code></pre>
  
  <p>However, since the closest I've come is something I'm not 100% satisfied with the semantics of;</p>
  
  <pre><code>&lt;div class="redundant-wrapper"&gt;
      &lt;dl class="main-list"&gt;
          &lt;dt&gt;Some Thing&lt;/dt&gt;
              &lt;dd&gt;You know it!&lt;/dd&gt;
          &lt;dt&gt;Another Thing&lt;/dt&gt;
              &lt;dd&gt;Word.&lt;/dd&gt;
      &lt;/dl&gt;
      &lt;dl class="another-main-list"&gt;
          &lt;dt&gt;Stuff!&lt;/dt&gt;
              &lt;dd&gt;Alright!&lt;/dd&gt;
      &lt;/dl&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>I was wondering if anyone has any other ideas of how you might do this?</p>
  
  <p>Also, the reason the items would be grouped is because they are visually grouped in the content that is being marked up. Imagine a dictionary page, with a single definition list, where each definition is in an inset box that is floated left. I run into this situation all the time.</p>