javascript - Using CSS to make table rows the same height -

i'm building app in angularjs gets product data , displays on page. reason mention angular because, due way ng-repeat works, can't put images 1 row default same height - each 'product' has own td, table, div or similar.

anyway, won't make sense without explaining code , issues i'm having. have products being displayed in rows of three. this:

as can see, when images same height, works fine. issue is, not of images same height, nor ever be. i'm looking solution accommodates this.

the markup

to avoid ugly <table> code i've put in fiddle here: http://jsfiddle.net/qgu2v/6/

the // spacer images i've marked in fiddle (if knew more tables) make searchimgcontainer fill height of containing <td>.

the question

any ideas on how can achieve this? goal not make image containers same height, vertically centre image within container (so there equal white space above , below it).

i know can javascript/jquery, i'm loading hundreds , thousands of products onto (mobile, responsive) page , feel checking height of neighbouring image create large page load.

is achievable or stuck javascript solutions?

try one..demo

.searchthumb{     height:100px; }