jquery - 对齐 div 取决于可用空间

标签 jquery css twitter-bootstrap html

我有如下所示的 div 对齐方式。我不需要正式的表格布局。我需要 DIV5 来使用 DIV2 下面的空间(标记为红色)。我正在使用 Bootstrap 框架,我需要一个通用的解决方案,以便无论我在哪里使用它,div 元素都会适当对齐。

enter image description here

请帮忙。提前致谢。

最佳答案

Twitter bootstrap 的网格系统不是流动的、级联的或任何你想调用它的东西。我假设您有两个带有列的“.row”div,并且它们只接受一行中的 12 列,仅此而已 - 行不会重叠。

你应该尝试使用像 Masonry ( http://masonry.desandro.com/ ) 这样的东西,有或没有 Bootstrap 。使用 Bootstrap ,您可以像这样在 row > col-lg-12 中创建 Masonry 网格

<div class="container">
    <div class="row">
        <div class="col-lg-12">
            Masonry grid plugin here.
        </div>
    </div>
</div>

关于jquery - 对齐 div 取决于可用空间,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/21576022/

相关文章:

css - 浏览器调整大小低于 767 像素时的 Bootstrap 样式问题

html - 如何让 Bootstrap 看起来更 "Compact"

用于 float 弹出窗口的 jQuery 插件

jquery - css3动画不启动jquery点击事件

javascript - 如何使用 toDataURL() 将图像作为背景图像与 Canvas 内容一起添加到一个图像中?

javascript - 定位事件幻灯片并添加 css 类

c# - 如何在鼠标单击时关闭 Bootstrap 警告警报?

javascript - Fullcalendar Rails 上的 Popover Bootstrap

javascript - 当我在不同的事件中使用它时,函数 javascript 不起作用

javascript - 如何使用 jquery 从 select 元素中删除选项?