html - 如何让div元素从下往上垂直堆叠?

标签 html css

我试图将 2 个 div 堆叠在一起(即从下到上)。 底部的具有动态高度,我希望顶部的 div 相应地堆叠在其上。

我希望它们从 bottom: 0 开始。不是从上到下

最佳答案

如果你正在寻找一个纯CSS 解决方案。

如果一个元素具有固定大小(例如图像,不推荐用于文本元素),您可以使用绝对定位:

http://jsfiddle.net/wHDWP/

.container {
    position: relative;
}

.top {
    border: 1px solid red;
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    height:  1.5em;
}

.bottom {
    border: 1px solid blue;
    padding-bottom: 1.5em;
}

如果你不顾一切,你可以使用 JS 重新排列元素。

关于html - 如何让div元素从下往上垂直堆叠?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/14033638/

相关文章:

html - marquee 代码在 chrome 中工作但在 firefox 中不起作用

html - 超出窗口宽度的溢出背景

php - 使用正则表达式捕获 html 标签内的内容

javascript 执行时间太长,让观众等待太久

css - Bootstrap : Using nav beside a floated element pushes other content down

javascript - 玩转 HTML 有序列表编号元素符号

html - 我怎样才能得到 Facebook 图标上的删除按钮

html - Bootstrap 3 和响应式背景图片?

html - 文本正在调整 flexbox 子项的大小而不是换行(使用 flex-grow)

HTML/CSS 图像出现在错误的区域?