CODEWITHSUNDEEP
jquerycssjquery-masonry
Andreas Norman
Andreas Norman

Reputation: 1027

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().

Upvotes: 3

Views: 5592

Answers (3)

Brandon
Brandon

Reputation: 57

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.

Upvotes: 2

Glorious Kale
Glorious Kale

Reputation: 1313

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.

Upvotes: 0

heisenberg
heisenberg

Reputation: 9759

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

Upvotes: 2

Related Questions