Html 使div粘贴到父对象的底部

我制作了一个简单的CSS条形图，但是所有的条形图都是从顶部开始的

.wrap{
宽度：400px；
位置：相对位置；
溢出：隐藏；
}
.柱状图{
显示：内联块；
左边距：0.2px；
}
.柱状图{
宽度：11px；
左边距：3倍；
字体大小：xx小；
文本对齐：居中；
颜色：#fff；
}

5.
7.

添加

垂直对齐：底部到您的。
条形图
类：


.wrap{
宽度：400px；
位置：相对位置；
溢出：隐藏；
}
.柱状图{
显示：内联块；
左边距：0.2px；
垂直对齐：底部对齐；
}
.柱状图{
宽度：11px；
左边距：3倍；
字体大小：xx小；
文本对齐：居中；
颜色：#fff；
}

5.
7.
使用flexbox怎么样？您只需将包装器设为flexbox，然后将项目与flex end对齐即可：

.wrap {
  display: flex;
  align-items: flex-end;
}

使用
flex-flow:wrap-reverse或
对齐项目：柔性端

.wrap {
      display : flex;
      flex-flow: wrap-reverse;
}

解决方案：
.wrap{
宽度：400px；
位置：相对位置；
溢出：隐藏；
显示器：flex；
柔性流动：反向包裹；
高度：100vh；
}
.柱状图{
显示：内联块；
左边距：0.2px；
}
.柱状图{
宽度：11px；
左边距：3倍；
字体大小：xx小；
文本对齐：居中；
颜色：#fff；
}

5.
7.
9
11
13
8.
10
垂直对齐和弯曲之间有什么区别吗？也许是浏览器支持之类的？谢谢CSS中的“垂直对齐”属性控制在一行上相邻设置的元素如何对齐。