If your Isotope masonry layout isn’t aligning correctly, the issue is likely due to a missing or incorrect .grid-sizer.

You should include a .grid-sizer div inside your .grid container and set it as the columnWidth in your Isotope configuration:

$('.grid').imagesLoaded(function () {
  $('.grid').isotope({
    itemSelector: '.grid-item',
    percentPosition: true,
    masonry: {
      columnWidth: '.grid-sizer'
    }
  });
});

Here’s a live demo I built that shows this solution in action: here
(Disclosure: I created this page to demonstrate the fix for others having the same issue.)