Trello Grid

trello-grid

javascript:(function(){$('.list-area').css('max-width','100%');$('.list').css('margin','10px 0 0 10px');var max = Math.max.apply(null,$('.list').map(function(){return $(this).height();}));$('.list').each(function(){$(this).css('margin-bottom', max - $(this).height())});})();

trello-grid-commented.js

(function(){
  // disable horizontal scrolling
  $('.list-area').css('max-width', '100%');
  // fix margins
  $('.list').css('margin', '10px 0 0 10px');
  // compute max height
  var max = Math.max.apply(null, $('.list').map(function(){
    return $(this).height();
  }));
  // align cards by pushing them with margins
  $('.list').each(function(){
    $(this).css('margin-bottom', max - $(this).height());
  });
  
  
  // alternative: give them all the same height
  /*
  $('.list').height(Math.max.apply(null,$('.list').map(function(){return $(this).height();})));
  
  */
})();

I would suggest fixing the overflow of the list wrapper:

$('.list-area-wrapper').css('overflow-y','auto');

Otherwise, great little snippet – thanks! 👍