gpt4 book ai didi

html - 居中一个 flex 元素并底部对齐另一个

转载 作者:技术小花猫 更新时间:2023-10-29 11:56:01 24 4
gpt4 key购买 nike

<分区>

我试图让一个 flex 元素垂直和水平居中。

我想将一些文本固定到 flex 容器的底部。

文本上的

margin-top:auto 只是将内框推到顶部。想法?

.container {
background: lightblue;
width: 300px;
height: 300px;
display: flex;
justify-content: center;
flex-direction: column;
align-items: center;
padding: 10px;
}
.container .box {
background: goldenrod;
height: 30px;
width: 30px;
}
<div class="container">
<div class="box"></div>
<span>Text</span>
</div>

这是 codepen .

24 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com