CSS Image Gallery

Image Gallery is used to store and display a collection of pictures. This example creates a responsive Image Gallery using HTML and CSS.

Example

div.gallery {
  margin: 5px;
  border: 1px solid #ccc;
  float: left;
  width: 180px;
}

div.gallery:hover {
  border: 1px solid #777;
}

div.gallery img {
  width: 100%;
  height: auto;
}

div.desc {
  padding: 15px;
  text-align: center;
}

You can click on above box to edit the code and run again.

Output

Goat

House

Love-birds