Image hidden dans un block

Bonjour,

je cherche a faire un présentation de mes images en html/css sur mon site mais je n'y parviens pas.

Je veux faire un block de 150*100px avec un contour et mettre des images dedant. Jusque là ça va.
Je désire mettre les images à 100px en hauteur et la largeur à "auto" et tout ce qui dépasse du 150px de largeur, je ne veux pas qu'il s'affiche, donc sois en "overflow:hidden".
C'est pour m'éviter de devoir faire des centaines d'image à 150*100 de hauteur manuellement.

Voilà ce que j'ai essayer:

Dans le HTML :

<div class="images"><a href="images/coverfb/coverfb.png"><img src="images/coverfb/coverfb.png" alt="cover facebook 01" /></a></div> 

Dans le css:

.imagesportfolio img {
 width: auto;
 height: 100px;
 overflow:inline;
 -webkit-transition:opacity 250ms ease-out; 
 -moz-transition:opacity 250ms ease-out; 
 -o-transition:opacity 250ms ease-out; 
 transition:opacity 250ms ease-out;
 -webkit-transition: all 200ms linear;
    -moz-transition: all 200ms linear;
    -o-transition: all 200ms linear;
    transition: all 200ms linear;
    -webkit-transform: translateZ(0);
    -moz-transform: translateZ(0);
    -o-transform: translateZ(0);
    transform: translateZ(0);
 display: hidden;
 
}
.imagesportfolio img:hover {
 opacity: 0.8;
}
.imageporfolio div .images{
 width: 150px;
 height: 100px;
 padding:2px;
 border: 1px solid #6CC;
 margin-top: 10px;
 margin-bottom: 10px;
overflow:hidden;
}

J'ai voulu donc mettre un div qui saurais la boite de 150*100px et mettre tout ce qui dépasse en overflow:hidden mais visiblement ça marche pas.

Vous pouvez, sois me donner un nouveau code fonctionnel ou prendre ce que j'ai tenté de faire et le rendre fonctionnel XD

J'espère avoir bien expliquer. Merci à ceux qui sauront m'aider.