Bootstrap 3-刪除輸入字段之間的太多空間，中間用短划線

Question

我希望輸入框為：

但得到：

有什么辦法可以消除兩者之間的多余空白並獲得所需的輸出，而無需使用css邊距。 我的代碼如下：

<div class="row">
    <div class="col-md-2 employerEin">
        <input type="text" name="employerEIN1" maxlength="2" size="2" value=""
               class="form-control" id="employerEIN1" title="EIN">
    </div>
    <span class="col-md-1 employerEin">-</span>
    <div class="col-md-3">
        <input type="text" name="employerEIN2" maxlength="7" size="7" value=""
               class="form-control" id="employerEIN2" title="EIN">
    </div>
</div>

Answer 1

只需將.form-inline類添加到您的<form>

<div class="row">
    <form class="form-inline">
        <div class="form-group">
            <input type="text" name="employerEIN1" maxlength="2" size="2" value="" class="form-control" id="employerEIN1" title="EIN">
            -
            <input type="text" name="employerEIN2" maxlength="7" size="7" value="" class="form-control" id="employerEIN2" title="EIN">
        </div>
    </form>
</div>

---

編輯：由於OP的注釋添加了其他代碼

只需將.form-inline類添加到封閉的div中，以使這兩個字段內聯，然后根據需要繼續添加其他字段

<div class="row">

    <!-- add the .form-inline class to the enclosing div -->
    <div class="form-group form-inline">
        <input type="text" name="employerEIN1" maxlength="2" size="2" value="" class="form-control" id="employerEIN1" title="EIN">
        -
        <input type="text" name="employerEIN2" maxlength="7" size="7" value="" class="form-control" id="employerEIN2" title="EIN">
    </div>

    <!-- add other form elements as needed -->
    <div class="form-group">
        <input type="text" name="field3" maxlength="2" value="" class="form-control">
    </div>
    <div class="form-group">
        <input type="text" name="field4" maxlength="7" value="" class="form-control">
    </div>

</div>