Reputation: 31
So, I'm making a website, using only html css and javascript, and I need to make a image grid like this, I tried using flexbox, but it is always buggy as hell...
.row {
display: flex;
padding: 100px;
color: #A3A3A3;
}
.column {
flex: 50%;
align-items: center;
}
.home-6 {
height: 100vh;
width: 100%;
background-color: #DBDBDB;
}
.home-6 .row {
object-fit: cover;
}
<div class="home-6">
<div class="row">
<div class="column-1">
<img src="assets/imgs/projetopessoal/Saba/saba/imghome/imghome.png">
</div>
<div class="column">
<img src="assets/imgs/projetopessoal/Aurora/aurora/imghome/imghome.png">
</div>
</div>
<div class="row">
<div class="column">
<img src="assets/imgs/projetopessoal/Tempodachuva/tempodachuva/imghome/imghome.png">
</div>
<div class="column">
<img src="assets/imgs/projetopessoal/Zinebrabas/zinebrabas/imghome/SCARRARD-Portfolio_imagem home_Zine.jpg">
</div>
<div class="column">
<img src="assets/imgs/projetopessoal/Bunker/bunker/home/imghome.png">
</div>
</div>
</div>
Thanks for your help ;)
Upvotes: 1
Views: 256