Stack Overflow
Stack Overflow

Questions tagged [masonry]

Masonry, formally jQuery Masonry, is a JavaScript cascading grid layout library.

Masonry is a JavaScript grid layout library. It works by placing elements in optimal position based on available vertical space, sort of like a mason fitting stones in a wall. You’ve probably seen it in use all over the Internet.

As of version 3, Masonry does not depend on jQuery anymore, but it can work alongside.

Created by David DeSandro, Masonry is released under the permissive MIT License.

Useful links

950 questions
0
votes
1 answer

Display none takes up space

I'm having some trouble with my Pagination nav that is display:none. When I check on inspect element it takes no space, but for some reason, where the pagination nav is, there's an empty space that is not supposed to be there. I've tried adding…
Penny
  • 253
  • 1
  • 5
  • 15
0
votes
1 answer

overlay images with Masonry in WP

I´m using Masonry and WordPress to make a little project to rate images... The problem that I have is with Mansonry, the images overlap between other images. http://postimg.org/image/kmvnzi7sh/ Here is the solution but I don´t understand how to fix…
andresgl
  • 117
  • 9
0
votes
1 answer

Advice needed with masonry layout causing overlaps- desperate

I need help with a pinterest/masonry layout in magento (i have not done magento part). I am a web designer but am out of my depth with this issue. Basically i have had to change the layout at the last minute after having it working great as a …
Ivanna Fernandez
  • 1
0
votes
0 answers

CSS column-count: 3, rendered 2

I'm making a simple masonry style layout in pure CSS. It seemed to be clean and simple but at last some bug appear. JSFIDDLE: http://jsfiddle.net/cheezburger/HXjtK/ CSS: .masonry { /* Masonry container */ -moz-column-count: 3; …
cheezburger
  • 77
  • 2
  • 9
0
votes
0 answers

jQuery masonry not stacking (gaps between items in vertical columns)

I first tried Masonry by myself, but there were gaps between the div items. so then I tried using the exact same code from http://jsbin.com/inunin/3/edit, from this tutorial: jaxenter.com/tutorial-get-a-tiled-layout-with-jquery-plugins-43514.html.…
maroo
  • 1
0
votes
1 answer

Masonry not displaying items corrently

I'm using the masonry jquery plugin to arrange some images in a container, the plugin seems to be working but it's not displaying the items correctly. There are spaces that can be filled by items but instead the items are "floating" left on the next…
user2962751
  • 13
  • 4
0
votes
0 answers

Masonry imagesReveal with CSS width

I'm trying to use Masonryjs with imagesReveal "plugin" and with the width of the elements based on CSS (I need it because my items are sized with media queries). This is my code: $( function() { var $container = $('#container').masonry({ …
Fez Vrasta
  • 14,110
  • 21
  • 98
  • 160
0
votes
1 answer

Instafeed and Masonry

I have this code below where I am trying to use Instafeed and Masonry together. Everything works fine until I click the "Load more" button. Then the Masonry layout breaks. It's probably because something is loading before the other or vice versa.…
Jesper Blomgren
  • 1
  • 1
0
votes
1 answer

imagesLoaded (Masonry) and IE incompatability

I'm using Masonry for a project and applying imagesLoaded accordingly. After many, many tests I figured out these two work almost perfectly together, but sometimes they'd fail. And 99% of the cases it's imagesLoaded's fault. However it seems that on…
Georgi Demirev
  • 446
  • 3
  • 22
0
votes
0 answers

How can I display images in sequential order with constant height without JavaScript?

I have a bunch of images that I'd like to display on a webpage. Each image has variable height and width. I'd like to display them in a row (that wraps to the next line depending on the width of the browser window) with a constant height but fixed…
ensnare
  • 40,069
  • 64
  • 158
  • 224
0
votes
1 answer

Deactivate masonry animation

I've developed a web page using masonry in order to rearrange a set of items of different heights, when user scroll down a "Loading..." message is shown and new items are loaded and layout is recalculated by masonry, so far so good. The problem is…
jmhostalet
  • 4,399
  • 4
  • 38
  • 47
0
votes
0 answers

How to center container with masonry image gallery

I've tried to center the items of my masonry layout, but it still always floats left and has lots of white space at certain browser widths. Also how could I get more padding on the bottom of the container between the hr element? Here's the website…
gboltz178
  • 3
  • 2
0
votes
2 answers

Masonry, Lazy load and ACF Gallery Field

I'm using the ACF gallery field to add images into a custom post type. The problem is that in the case of one post I've added around 80 images which means that they all have to load before Masonry is triggered. I thought I'd use lazy load to load…
SpyLefkaditis
  • 1
  • 1
  • 3
0
votes
1 answer

How do I filter using double words?

I am implementing a modified version of Masonry where I have a series of photos that can be filtered by clicking on a filter list at the top of the page. When the filter is a single word like Photography or Video, the filter works fine, but when the…
forrest
  • 10,570
  • 25
  • 70
  • 132
0
votes
1 answer

insert masonry in php from images that were retreieved from a mysql database

I would like to insert masonry into a php form that retrieves images from a MySQL database. I can retrieve the images, but when I try to put in masonry, the whole thing doesn't work at all. Here is my code $result = mysqli_query($con,"SELECT…
user3435505
  • 157
  • 2
  • 10
1 2 3
…
63 64