Temos o layout de grade para a Galeria em andamento. Infelizmente, o carregamento dele é um pouco abrupto e instável. Isso ocorre porque as colunas CSS3 são projetadas para dividir o conteúdo entre cada uma das colunas uniformemente, mas as imagens às vezes demoram um pouco para carregar e ainda não têm largura / altura para usar. Então, quando eles aparecem, as colunas precisam se reorganizar.
No entanto, acho que podemos evitar essa dificuldade com algum JavaScript. Como sabemos a altura e a largura das imagens, podemos criar uma caixa com a proporção correta para colocá-la como espaço reservado. Então, quando a imagem for carregada, substituiremos o marcador de posição pela imagem.
No final do vídeo estamos no caminho certo, mas está um pouco quebrado. Não se preocupe, vamos consertar no próximo vídeo.