Asp.net mvc 使用引导时将列组合在一起

我在引导列中有几个文本框，我想让它们彼此靠近，但无论我做什么，文本框之间的距离都保持不变

我怎么能

缩短文本框之间的距离

缩短/缩小列背景或使文本框更靠近列的外部

这是我的代码

            <div class="col-xs-12 col-md-2">
                <div class="well form-group">
                    <div class="bisformdynamiclabel">Box 1</div>
                    <input class="form-control" type="text" asp-for="myclass.box1" />
                    <span asp-validation-for="myclass.box1" class="alert-danger"></span>
                </div>
            </div>
            <div class="col-xs-12 col-md-2">
                <div class="well form-group">
                    <div class="bisformdynamiclabel">Box 2</div>
                    <input class="form-control" type="text" asp-for="myclass.box2" />
                    <span asp-validation-for="myclass.box2" class="alert-danger"></span>
                </div>
            </div>
            <div class="col-xs-12 col-md-2">
                <div class="well form-group">
                    <div class="col-lg-1">
                        <div class="bisformdynamiclabel">Box 3</div>
                        <input class="form-control" type="text" asp-for="myclass.box3" />
                        <span asp-validation-for="myclass.box3" class="alert-danger"></span>
                        </div>
                    </div>
                </div>

方框1
方框2
方框3

---

提前感谢大家的帮助

查看详细信息，了解它对距离的影响。您希望这种情况发生在移动/小屏幕还是宽屏幕上？在div中设置的类用于设置元素的“宽度”，这意味着在小型设备上，宽度将（几乎）为全宽（col-xs-12，尽管我认为现在应该是col-12），在中型设备上，12列中只有2列。