2
respostas

[Dúvida] O que é essa sessão roxa?

Bom dia amigos,

poderiam me explicar o que seria esse elemento em roxo? não consegui entender ainda.

Inspecionar Elementos

2 respostas

A área em roxo serve para destacar espaços vazios dentro de um elemento. Deste modo é possível compreender tanto a altura quanto a largura de um elemento mesmo que não haja nenhum conteúdo dentro dele.

Por exemplo, pela imagem abaixo eu consigo saber que o section das informações do usuário ocupa a largura inteira do layout, por mais que seu conteúdo acabe um pouco antes da metade da sua largura.

Devtools inspect tool

Para mais referência, vou deixar um link do stackoverflow de alguém com a mesma dúvida: https://stackoverflow.com/questions/67252231/what-is-the-purpose-of-this-purple-dashed-line-area

Luciano, boa tarde!

Essa área roxa, é o espaço que existe entre os elementos. Através do inspecionar que você utilizou, consegue ter uma visualização de como o estilo css está "afetando" seus elementos. No vídeo da aula, em 04:19 o professor fala do espaço que existe a direita do container, a grosso modo podemos entender que esse espaço foi incorporado através do width e fica disponível entre os elementos.