Top/bottom margin with Masonry stacking

I'm using JQuery and Masonry and as you can see from the image the boxes doesn't stack properly. The side margins are great but the top/bottom gives random amount of large space in between.

Anybody who can help me here?

CSS for the boxes:

div.article {
background-color: white;
margin-right: 6px;
padding: 20px 10px;
width: 155px;}

Screenshot of problem: https://skitch.com/subzane/f8n36/2010-andreas-normans-blogg

Solution: It seems the error only appeared when using custom fonts. And to fix that, the script must be loaded using Using $(window开发者_开发技巧).load() instead of $(document).ready().

Assuming div.article is also your masonry item selector, you need to have it floated left.

I know this is an ancient question, but I had this exact problem. The solution, in my case, was adding the width/height to the images that were within some if my item containers.

Yes, window.load() works but as I've dug more I found that there was an input type hidden in between some of the items. Take a look if you have any tag in between of your item list.