有没有办法让同位素填充固定宽度 div 的所有空白

发布于 2024-12-14 04:59:06 字数 328 浏览 1 评论 0原文

有没有办法让同位素填满一行上的所有空白?

该容器具有固定宽度和 3 种不同类型的盒子(3 种宽度和固定高度)。我看到了 3 种可能的解决方案:

  1. 让 isotope 进一步查看列表,并决定组合框的最佳方式,以便减少空白,并且这些空间都位于容器的底部。在这种情况下,我们需要足够的不同大小的框。

  2. 调整一些框的大小并移动它们,以便该行始终填满。

  3. 在将盒子放入容器之前检测盒子的数量及其尺寸,并更改其中一些盒子的尺寸,因此有多种尺寸,希望同位素的空白行会更少。

我希望有人能让我走上正确的方向

Is there a way to make isotope fill all the white spaces on a row?

The container has a fixed width and 3 different types of boxes (3 widths and a fixed height). I see 3 possible solutions:

  1. Make isotope look further down the list and make the decision in what is the best way to combine the boxes so there are fewer white spaces and those spaces are all at the bottom of the container. In this case we need enough boxes of different sizes.

  2. Resize some of the boxes and move them so the row is always full.

  3. Detect the number of boxes and their sizes before they are placed in the container and change the size for some of them, so there is a variety of sizes and hopefully isotope will have less rows with white spaces.

I hope someone can put me in the right direction

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(1

旧时浪漫 2024-12-21 04:59:06

简而言之,同位素不具备这些特征。但如果您是一位才华横溢的开发人员,您可以自己添加它们

  1. 已请求此功能,但我没有计划实现此类功能。请参阅:https://github.com/desandro/isotope/issues/125

  2. 调整项目大小超出了同位素的范围。同位素仅定位项目

  3. 请参阅 2

同位素是可扩展的。 虽然我无意添加这些功能,但您可以创建自己的自定义布局模式来实现这一点。

In short, Isotope does not have these features. But if you're a talented developer, you could add them yourself

  1. This feature has been requested, however I have no plans to implement such a feature. See: https://github.com/desandro/isotope/issues/125

  2. Resizing items is outside the scope of Isotope. Isotope only positions items

  3. See 2

Isotope is extendible. While I have no intention to add these features, you could create your own custom layout mode that does it.

~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文