Seamless Responsive Image Grid

<div id=”images”>
<img src=”images/sample1.jpg” alt=”” />
<img src=”images/sample2.jpg” alt=”” />
<img src=”images/sample4.jpg” alt=”” />
<img src=”images/sample5.jpg” alt=”” />
…
</div>

CSS CODE

#images{
line-height: 0;
-webkit-column-count: 3;
-webkit-column-gap: 0px;
-moz-column-count: 3;
-moz-column-gap: 0px;
column-count: 3;
column-gap: 0px;

}
#images img {
width: 100% !important;
height: auto !important;
}

FOR RESPONSIVE – ADAPTIVE screen

@media (max-width: 400px) {
#photos {
-moz-column-count: 1;
-webkit-column-count: 1;
column-count: 1;
}
}


For more JS based solution : use link link Click here