在Bootstrap输入元素上使用内联文本

Question

排列删除和输入控件的最佳方法是什么，而不是在不同的行上？

Fiddle here

<input type="text" class="form-control booking waypoint" placeholder="Via 1"> Remove

Answer 1

Bootstrap告诉输入是100％宽...所以你必须调整它。

JSfiddle With Bootstrap Demo

input.form-control.booking.waypoint {
    width:50%;
    display: inline-block;
}

<input type="text" class="form-control booking waypoint" placeholder="Via 1"/>
<label for="">Remove</label>

Answer 2

试试这个：

#remove{
    display:inline;
}

.booking{
    width:50%;
    display:inline;
}

<input type="text" class="form-control booking waypoint" placeholder="Via 1"> <p id="remove">Remove</p>

Answer 3

您可以使用.col-any class name。

对于文本框

  

col-lg-7

和标签

  

.COL-LG-5