控制单个砌体项目的位置

Question

我在 WordPress 中使用砌体布局，因此我本地站点的砌体布局与循环组合在一起。我创建了一个 fiddle 来解释我的问题。

如何控制一个项目在砌体布局中的位置？

我希望 div 始终位于砌体容器的右上角（在我的左上角标记的右侧）

如何覆盖 masonry 为其 .box 项目分配的定位？

#container { max-width:635px; width:100%; }
.corner-stamp { background:gray;  width: 90px; height: 90px; }

.box {
  width: 90px;
  height: 90px;
  margin: 5px;
  background: #6AD;
  float: left;
}

/* I want to freely position this item with css */
#biggerBlock{ 
  width: 395px;
  height: 200px;
  background: #6AD;
  left:25%; /* overidden by masonry */
}

.box.large {
  background: #084;
  z-index: 2;
}

更新：

David Desandro 在official Masonry Git 页面上回答了这个问题。新的同位素 v2 将具有此功能，能够包含 2 个角标。感谢您的反对。

Answer 1

现在纯砌体中没有cornerStampSelector 属性。您可以使用stamp 选项：

指定在布局中标记哪些元素。这些都是 Masonry 不会布置的特殊布局元素。相当， Masonry 将在下面标记元素布局项目元素。

$container.masonry({
    columnWidth: 100,
    animate: true,
    stamp: '#biggerBlock'
  });

还有stamp方法：

标记布局中的元素。砌体将布置项目元素 围绕标记元素。

$container.masonry('stamp',$('#biggerBlock'));