蓝色组件:
height: "95.4vh",
backgroundColor: "#f0f0f0",
overflow: "auto",
橙子组分:
display: "flex",
justifyContent: "center",
marginRight: "17px",
marginLeft: "17px",
绿色组件
marginTop: "16px",
marginBottom: "78px",
如果我的绿色项目将被添加,我如何将橙子组件定位到底部并让它增长到顶部?ChatGPT给了我显示Flex的解决方案,但之后滚动不再可能。
编辑:这里是一个工作示例。正如你所看到的,当你调整蓝色容器的大小时,橙子粘在顶部。但我希望它粘在底部并增长到顶部。https://jsfiddle.net/ex9dwks3/
3条答案
按热度按时间k97glaaz1#
首先,像这样更新蓝色组件的CSS:
现在将绿色组件的CSS更改为以下内容:
你可以保留橙子CSS,这应该可以做到!橙色组件现在将位于底部,绿色组件将在添加项目时增长,滚动仍然可以工作。如果你有任何问题,请告诉我!
ih99xse12#
试试这个
wxclj1h53#
我写了一些类似下面的东西。我希望它对你有用。