Or if any link really ...

Here is a page with masonry applied ...

wlst2017.lawryk.ca/gallerylist.php

Here is the exact same page with Lightbox applied. Doesn't even have to have lightbox applied. If the image has even an empty anchor tag the result is the same.

wlst2017.lawryk.ca/gallerylist2.php

Here is the same page with no lightbox. Just Masonry with an anchor tag.

wlst2017.lawryk.ca/gallerylist3.php

As soon as you wrap the image in an anchor tag it kills Masonry.

Strange .... this breaks masonry.

<div id="repeatimages" is="dmx-masonry" dmx-bind:repeat="randomimages.data.query1.randomize().top(15)" key="imgId" animated="true" columns="3" gutter="5">
<a href="javascript:void(0);" dmx-bind:href="/_images/gallery/large/{{imgFull}}" dmx-lightbox:images="" dmx-bind:title="playTitle"><img class="img img-responsive img-thumbnail" dmx-bind:src="/_images/gallery/thumbs/{{imgThumbnail}}"></a>
</div>

But this works. All I did was add an empty div tag around the image.

<div id="repeatimages" is="dmx-masonry" dmx-bind:repeat="randomimages.data.query1.randomize().top(15)" key="imgId" animated="true" columns="3" gutter="5">
<div>
<a href="javascript:void(0);" dmx-bind:href="/_images/gallery/large/{{imgFull}}" dmx-lightbox:images="" dmx-bind:title="playTitle"><img class="img img-responsive img-thumbnail" dmx-bind:src="/_images/gallery/thumbs/{{imgThumbnail}}"></a>
</div>
</div>

Hello Brad,
In order to layout the elements properly in a grid, the child elements must be block elements.
The default <a> display property is inline, not block. If you want to use <a> elements directly as child elements set their display property to: block.

Yeah, makes sense now. Just couldn't get my head around it. But once I figured that out it was smooth sailing. Great extension guys. Thanks.