Responzívna galéria obrázkov s HTML a CSS

 <div class="galeria"> <div class="box"><img src="obrazok1.jpg" alt="Obrázok 1"></div> <div class="box"><img src="obrazok2.jpg" alt="Obrázok 2"></div> <div class="box"><img src="obrazok3.jpg" alt="Obrázok 3"></div> <div class="box"><img src="obrazok4.jpg" alt="Obrázok 4"></div> </div> 

 .galeria { display: flex; flex-wrap: wrap; gap: 10px; }

.box {
flex: 1 1 200px;
overflow: hidden;
border-radius: 8px;
}

.box img {
width: 100%;
display: block;
transition: transform 0.3s;
}

.box img:hover {
transform: scale(1.05);
}

@media (max-width: 768px) {
.galeria {
flex-direction: column;
}

.box {
    margin: 5px 0;
}


}