gpt4 book ai didi

html - Flex 元素在 Firefox 中溢出

转载 作者:搜寻专家 更新时间:2023-10-31 22:17:49 24 4
gpt4 key购买 nike

<分区>

我正在尝试创建一个表单,其中第一行的单个文本字段宽度为 100%,第二行的 3 个字段等距。它在 Chrome 上运行良好。然而,它在 FireFox 上泛滥成灾。

.form {
display: flex;
flex-direction: column;
width: 300px;
justify-content: center;
align-items: center;
margin: 0 auto;
}

.form input {
width: 100%;
padding: 20px;
}

.form .number {
width: 100%;
display: flex;
align-items: center;
justify-content: center;
}

.form .expiry {
display: flex;
width: 100%;
justify-content: space-between;
}
<div class="form">
<div class="number">
<input data-stripe="number" placeholder="Credit Card Number" class="" type="text">
</div>
<div class="expiry">
<input data-stripe="exp-month" placeholder="MM" class="" type="text">
<input data-stripe="exp-year" placeholder="YY" class="" type="text">
<input data-stripe="cvc" placeholder="CVC" class="" type="text">
</div>
</div>

https://jsfiddle.net/xhr031yr/2/

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