How to center img inside a div? [duplicate]

I'm doing a grid of images (which will be links to lightbox), I want 5 images per line, but they have different sizes, so I made the following html for each image:

 <div class="thumb">
<a href="images/900x600/img01.jpg" data-lightbox="gallery">
    <img src="images/thumbs/thumb01.jpg" alt="">
</a>
 </div>

And in CSS it looks like this:

.thumb {
 width: 180px;
 height: 180px;
 position: relative;
 float: left;
}
.thumb img {
 position: relative;
 margin: auto;
 display: block;
}

To get everything right, the ideal would be for the images to be aligned both vertically and horizontally within their divs, which is 180px each, making 5 images per line because my layout is 900px wide. For horizontal alignment, I used margin: auto and display: block, but I can not align vertically, I already tried to use vertical-align, put a span.helper, with height 100% and inline block, use line-height, but none of them it works. And if I do not use display: block in imgs, they do not align even horizontally. How do I centralize them?

EDIT: One detail I did not mention is 45 images, all of them of different sizes, so it is difficult to define the dimensions of each of them in html or css, as I believe it would increase the file size considerably or do you think it would not?