Verificação HTML: O elemento "div" está a faltar uma instância obrigatória do elemento filho "dd

Sobre este problema HTML

O elemento <dl> representa uma lista de descrição — uma coleção de termos (<dt>) emparelhados com as suas descrições (<dd>). De acordo com a especificação HTML, o conteúdo permitido de um <dl> são grupos de elementos <dt> e <dd> diretamente, ou elementos <div> que envolvem esses grupos. Esta opção de envolvimento com <div> existe especificamente para ajudar com o estilo, uma vez que permite aplicar CSS a um par termo-descrição como uma unidade.

No entanto, estes elementos <div> envolventes não são contentores de uso geral dentro de <dl>. A especificação exige que cada <div> dentro de um <dl> contenha pelo menos um filho <dt> ou <dd>. Um <div> que está vazio, ou que contém outros elementos como <span>, <p>, ou outro <div>, viola esta regra e produz um erro de validação.

Isto é importante por várias razões. Os leitores de ecrã e tecnologias assistivas dependem da estrutura semântica das listas de descrição para transmitir a relação entre termos e definições. Um <div> vazio ou incorretamente estruturado dentro de um <dl> quebra esse contrato semântico, potencialmente confundindo tanto a tecnologia assistiva como os navegadores. Manter a sua marcação válida também garante renderização consistente em todos os navegadores.

Como corrigir

Certifique-se de que cada <div> dentro de um <dl> contém pelo menos um <dt> ou <dd> — não deixe elementos <div> envolventes vazios.
Não coloque conteúdo não-<dt>/<dd> diretamente dentro destes <div> envolventes — elementos como <span>, <p>, ou elementos <div> aninhados devem ser colocados dentro de um <dt> ou <dd>, não como irmãos deles.
Remova <div> envolventes desnecessários — se um <div> dentro de um <dl> não serve nenhum propósito de estilo ou agrupamento, remova-o inteiramente.

Exemplos

❌ `<div>` vazio dentro de um `<dl>`

<dl>
  <div>
  </div>
  <div>
    <dt>HTML</dt>
    <dd>Uma linguagem de marcação para estruturar conteúdo web.</dd>
  </div>
</dl>

O primeiro <div> está vazio e não tem filho <dt> ou <dd>, desencadeando o erro.

❌ `<div>` com apenas filhos não-`<dt>`/`<dd>`

<dl>
  <div>
    <p>Esta é uma lista de descrição:</p>
  </div>
  <div>
    <dt>CSS</dt>
    <dd>Uma linguagem de folha de estilo para descrever apresentação.</dd>
  </div>
</dl>

O primeiro <div> contém um elemento <p> mas nenhum <dt> ou <dd>, o que é inválido.

✅ Cada `<div>` contém elementos `<dt>` e `<dd>`

<dl>
  <div>
    <dt>HTML</dt>
    <dd>Uma linguagem de marcação para estruturar conteúdo web.</dd>
  </div>
  <div>
    <dt>CSS</dt>
    <dd>Uma linguagem de folha de estilo para descrever apresentação.</dd>
  </div>
</dl>

✅ Usar `<dl>` sem `<div>` envolventes

Se não precisar de elementos <div> para estilo, pode colocar <dt> e <dd> diretamente dentro do <dl>:

<dl>
  <dt>HTML</dt>
  <dd>Uma linguagem de marcação para estruturar conteúdo web.</dd>
  <dt>CSS</dt>
  <dd>Uma linguagem de folha de estilo para descrever apresentação.</dd>
</dl>

✅ Um `<dt>` com múltiplas descrições `<dd>` num `<div>`

Um único termo pode ter múltiplas descrições. O <div> é válido desde que contenha pelo menos um <dt> ou <dd>:

<dl>
  <div>
    <dt>JavaScript</dt>
    <dd>Uma linguagem de programação para a web.</dd>
    <dd>Suporta programação orientada por eventos e funcional.</dd>
  </div>
</dl>