html - 如何使所有输入表单 100% 宽度

Question

我尝试了不同的方法来使所有输入表单具有相同的宽度，并让它们都以 100% 结束，但它不适用于下面的星座。有人知道如何实现这个想法吗？

<form action="" method="post">
                                                    
  <div class="form-group">
    <input type="text" class="form-control" style="width: 100%" placeholder="Card Number" data-securionpay="number" />
  </div>
                                                  
  <div class="form-group" >
    <input type="text" class="form-control" style="width: 32%" placeholder="CVC"/>
    <input type="text" class="form-control" style="width: 21%" placeholder="MM"/>
    <span> / </span>
    <input type="text" class="form-control" style="width: 42%" placeholder="YYYY"/>
  </div>
                                                  
  <button style="width: 100%" type="submit">Pay</button>
</form>

Answer 1

你需要:

.form-group {
    display: inline-block;
}

因为现在 div 用新空间分隔您的部分，但是如果您使用“内联 block ”，那么您的每个 div 都将关闭。这应该在一行中输入附近​​的输入。