如何内联输入组内的元素（强制它们在一行上）
Posted
tags:
篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了如何内联输入组内的元素（强制它们在一行上）相关的知识，希望对你有一定的参考价值。
我试图内联我的div中的元素，而不是将它们分解成自己的col
html：
<div class="row">
<div class="col-sm-12">
<label for="null" class="control-label">Item Add-ons</label>
</div>
<div class="items_part">
<div class="col-xs-12">
<div class="input-group added_items">
<input type="text" name="item_name[]" value="Ticket" class="form-control" readonly="">
<input type="text" name="item_desc[]" value="Free Ticket" class="form-control">
<span class="glyphicon glyphicon-remove input-group-addon" aria-hidden="true"></span>
</div>
</div>
</div>
</div>
这最终导致输入占据100％的宽度，因此它们最终相互堆叠。
为了更清楚，我希望将其作为：
input1 input2 delete_button
此代码导致：
input1
input2
delete_button
也是内联形式的bootstrap的链接：here
答案
div class="row">
<div class="col-sm-12">
<label for="null" class="control-label">Item Add-ons</label>
</div>
<div class="items_part">
<div class="col-xs-12">
<div class="input-group added_items">
<li> <input type="text" name="item_desc[]" value="Free Ticket" class="form-control"></li>
<li> <span class="glyphicon glyphicon-remove input-group-addon" aria-hidden="true"></span></li>
</div>
</div>
</div>
</div>
css：added_items {width：100％;} added_items ul li {display：inline-block;宽度：30％;}
以上是关于如何内联输入组内的元素（强制它们在一行上）的主要内容，如果未能解决你的问题，请参考以下文章