根据Masonry文档中的示例http://masonry.desandro.com/options.html，我通过设置isFitWidth = true并在砌体容器上设置{margin: 0 auto}来集中我的Masonry布局。
当我有大量要显示的项目时，这是一个非常好的解决方案。例如，假设我的视口宽度超过5列，我将看到所有项目布局，5到一行，整个容器在我的视口中居中。可爱。
当我的项目少于5件时会出现问题。在这种情况下，容器在视口中保持居中，但它会收缩以适合项目数。例如，如果我有两个项目，我将在屏幕中间有两列，每个都有一个项目。
我希望看到容器维护的大小（在本例中为5列），并保持居中，并将内容放在LTR（在我的情况下）。
我已经尝试过媒体查询并根据视口设置容器的最小宽度。这看起来会起作用，但它很麻烦 - 我不希望每次我的列大小更改时都必须更新媒体查询（包括重新计算所有大容器宽度）。 （我相信用户会想要一些改变）。
另一个解决方案可能是向内容添加一些虚假项目并将其可见性设置为隐藏，但这也不是很优雅。
我缺少一个更简单的解决方案吗？
还有一点 - 我也在上面标记了一些物品，左上角和右上角。我认为这不会影响任何解决方案。
答案 0 :(得分：2)
好的，所以我能找到有效地做到这一点的唯一方法就是使用媒体查询。我设置了一个电子表格，以帮助我在更改列和装订线尺寸时重新计算内容。这是变量和方程式，以防它们有用：
如果：
然后：
您可以设置电子表格并使用WC和WG进行实验，范围为N = 1 ... 10这将为每个N值提供CON的大小。视口的宽度需要为CON加上CON（或其父）的任何水平边距和填充。
要设置媒体查询，我采用的方法是容器应尽可能宽，但仍能整齐地容纳精确的列。因此，例如，如果视口可以容纳5列（但不是6），我在CON上设置相应的最小宽度。这使容器整齐地居中。
举例来说，这是我的一个媒体查询：
@media (min-width: 996px) and (max-width: 1361px) { .content-container { min-width: 966px; } }
我希望这对某人有帮助。如果还有其他解决方案，我会将问题保持开放几天。