Código Layout imagens INSTAGRAM

Boa noite, pessoal.

Venho disponibilizar para vocês o código onde simula as imagens parecido com o do Instagram, o usuário pode passar para o lado deslizando.

Segue exemplo: https://imgur.com/GwVUtqP.gif

/* Estilos gerais */ body { font-family: Arial, sans-serif; margin: 0; padding: 0; }
/* Estilos para a seção de postagens */
.postagens {
  display: flex;
  overflow-x: scroll;
  scroll-snap-type: x mandatory;
  width: 100%;
  height: 400px;
}

.postagem {
  scroll-snap-align: start;
  flex: 0 0 100%;
  max-width: 100%;
  height: 100%;
  background-color: #f1f1f1;
  padding: 20px;
  box-sizing: border-box;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 24px;
}

Olá Wesley.

Desculpa-me pela ignorância, mas como poderia fazer para este código funcionar na plataforma da Fabapp, ou seja, o que acrescentar para ele funcionar? Não basta copiar e colar.

Olá, vou fazer um repositórios e enviar os links, depois é só copiar e colar. Todos já foram testador por mim.

1 curtida

Bom dia à todos!

@Wesley_Nunes Obrigado pela contribuição! Deixo como sugestão usar o site https://jsfiddle.net para compartilhar códigos, ou usar este exemplo de formatação da comunidade Fabapp!