O modelo de layout table
, é apropriado para exibição de estrutura de dados tabulares, "pois possuem uma estrutura interna complexa, com vários papéis diferentes que seus filhos e descendentes podem preencher".
Ele se torna apropriado quando faz sentido, não faz sentido usá-lo em um elemento img
apenas para fazer uso de propriedades de alinhamento, por exemplo.
Achei que uma resposta objetiva e com referências, fosse suficiente, talvez pela relação complexa embutida em seu interior o que segue abaixo seja necessário.
..."o display table faz com que o elemento (divs, sections, etc.) tenha um comportamento bem semelhante a de uma tabela com a tag table
...
Quando diz semelhante, me passa a impressão de algo um tanto distante, entretanto é o comportamento de uma tabela.
table
"O elemento gera uma wrapper box de tabela principal que estabelece um contexto de formatação de bloco e que contém um grid box de tabela gerada adicionalmente que estabelece um contexto de formatação de tabela."
Veja um pouco mais sobre a complexidade de modelos de layout:
Alguns modelos de layout, como o table e o ruby , possuem uma estrutura interna complexa...
...
box
com tipos de exibição específicos de layout geram wrapper box anônimas ao redor de si quando colocadas em um pai incompatível, conforme definido por suas respectivas especificações.
Por exemplo, o layout de tabela requer que uma table-cell
deva ter table-row
como pai.
Se for mal interpretado, assim:
<div style="display:block;">
<div style="display:table-cell">...</div>
</div>
Ele irá gerar wrapper box em torno de si, produzindo uma estrutura como:
block box
└anonymous table box
└anonymous table-row-group box
└anonymous table-row box
└table-cell box
Mesmo se o pai for outro elemento da tabela interna , se não for o correto , as wrapper box serão geradas.
Esse "conserto" garante que o layout da tabela tenha uma estrutura previsível para operar.
Faz sentido... x)