Esiste un modo valido per avvolgere un dt e un dd con un elemento HTML?

Question

Vorrei che HTML potesse fare qualcosa di semanticamente equivalente a questo;

<dl class="main-list"> 
    <definitionitem> 
     <dt>Some Thing</dt> 
      <dd>You know it!</dd> 
     <dt>Another Thing</dt> 
      <dd>Word.</dd> 
    </definitionitem> 
    <definitionitem> 
     <dt>Stuff</dt> 
      <dd>Alright!</dd> 
    </definitionitem> 
</dl> 

Tuttavia, dato che il più vicino Sono venuto è qualcosa che non sono soddisfatto al 100% con la semantica;

<div class="redundant-wrapper"> 
    <dl class="main-list"> 
     <dt>Some Thing</dt> 
      <dd>You know it!</dd> 
     <dt>Another Thing</dt> 
      <dd>Word.</dd> 
    </dl> 
    <dl class="another-main-list"> 
     <dt>Stuff!</dt> 
      <dd>Alright!</dd> 
    </dl> 
</div> 

Mi chiedevo se qualcuno ha altre idee su come si potrebbe fare questo?

Inoltre, il motivo per cui gli articoli sarebbero raggruppati è perché sono raggruppati visivamente nel contenuto che viene marcato. Immagina una pagina del dizionario, con un unico elenco di definizioni, in cui ogni definizione si trova in una casella di riquadrato a sinistra. Mi imbatto in questa situazione tutto il tempo.

Answer 1

No, Ian Hickson (editor HTML spec) è convinced che questo è un problema CSS, HTML non è un uno:

Questo non dovrebbe essere necessario. È una limitazione di CSS.

La soluzione corretta è che il CSS fornisca qualche pseudo-elemento o altro meccanismo che introduce un contenitore anonimo nell'albero di rendering che racchiude gli elementi che si desidera avvolgere.

Allo stesso tempo, fantasai (CSS Editor spec) è convinto in contrary:

Non credo che questo sia un problema CSS. Penso che sia un problema HTML. Gli pseudo-elementi sono una cosa non banale da specare, e una cosa non banale da implementare, e una cosa relativamente confusa da usare.

Tuttavia, Ian a quanto pare lo ignora e continua a essere distaccato dalla realtà.

Non ci sono stessi problemi con LEGEND (che deve essere il primo figlio diretto di FIELDSET in base alle specifiche HTML), FIGCAPTION (che deve essere il primo/ultimo figlio diretto di FIGURE), e LI (figlio diretto di UL/OL).

Per quanto riguarda DT/DD in particolare, io personalmente uso UL lista con DL dentro ognuno di LI:

<ul> 
    <li><dl> 
     <dt>Lorem</dt> 
     <dd>Lorem definition</dd> 
    </dl></li> 

    <li><dl> 
     <dt>Ipsum</dt> 
     <dd>Ipsum definition</dd> 
    </dl></li> 
</ul> 

Così abbiamo DL di fare rapporto tra DT e DD, e UL lista per farli tutti appartengono a una lista.

Aggiornamento (2016/11/14): Lo standard HTML (WHATWG version per ora) ora (dal 2016/10/31) allows dell'elemento DIV (opzionalmente miscelato con cosiddetti elementi di script di supporto SCRIPT, TEMPLATE) per essere figli diretti di elementi DL.HTML validator di W3C fa non conto per questo cambiamento ancora, ma lo sperimentale HTML5.org validator fa.

Aggiornamento (2017/01/18): Risulta le specifiche non not consentono più di un nidificato DIV wrapper per DT/DD, quindi l'utilità della funzione, in pratica, è in realtà molto limitato e la UL → → LI L'approccio DL qui descritto è ancora pertinente.