Techno Loop

Quantas vezes, ao inspecionar elemento, você já se deparou com essa situação? Apenas apertando a seta para baixo em seu teclado até achar um valor display que funcione?
Esse post é para aquelas pessoas que ainda sentem dificuldade na hora de implementar a propriedade "display" em seu CSS, então vai aí uma tabela com informações importantes para cada situação que você pode encontrar em seu código:

Valor	Comportamento
inline	Padrão de todos os elementos html, coloca-os em linha
inline-block	Usado quando precisamos pegar as dimensões do elemento sem definir suas dimensões, como block, porém colocando o elemento em linha
inline-flex	Tem o mesmo comportamento do "flex", porém coloca o elemento em linha (CSS3)
inline-table	Usado para colocar uma tabela em linha
block	Faz um elemento se comportar como bloco (nada aos lados)
flex	Valor para containers, faz com que seus filhos tenham alinhamento ao meio de acordo com seus tamanhos sem aplicar margem (CSS3)
list-item	Faz um elemento se comportar como uma "li"
table	Elemento comporta-se como a tag "table"
table-caption	Elemento comporta-se como a tag "caption"
table-column-group	Elemento comporta-se como a tag "colgroup"
table-header-group	Elemento comporta-se como a tag "thead"
table-footer-group	Elemento comporta-se como a tag "tfoot"
table-row-group	Elemento comporta-se como a tag "tbody"
table-cell	Elemento comporta-se como a tag "td"
table-column	Elemento comporta-se como a tag "col"
table-row	Elemento comporta-se como a tag "tr"
run-in	Elemento comporta-se como "inline" ou "block" dependendo do seu contexto
none	Faz com que o elemento não apareça no layout (mas ainda está no DOM da página)
initial	Coloca o elemento de acordo com seu valor padrão
inherit	Elemento pega o mesmo valor do pai, no caso, do display