html - 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>