#html #css #twitter-bootstrap
#HTML #css #twitter-bootstrap
Вопрос:
Я использую bootstrap3 в своем проекте.
У меня есть эти html-элементы:
<form class="form-inline">
<div class="form-group">
<div class="input-group">
<span class="input-group-addon">from-</span>
<input id="input1" class="form-control input-sm" type="text/>
<!--How can I make here space-->
<span id="span2" class="input-group-addon">to-</span
<input class="form-control input-sm" type="text" />
</div>
</div>
</form>
Здесь работает PLUNKER.
Как вы можете видеть, у меня есть промежутки и входные данные внутри элемента формы.Как я могу сделать пробел между элементом с id = input1
и span с id = «span2»?
Ответ №1:
Проблема заключалась в том, как вы сгруппировали элементы. Просто оберните каждый из ваших интервалов и входных данных div, который имеет class="input-group"
Вот codepen
HTML
<form class="form-inline">
<div class="form-group">
<div class="input-group">
<span class="input-group-addon">from-</span>
<input id="input1" class="form-control input-sm" type="text" />
</div>
<!--How can I make here space-->
<div class="input-group">
<span id="span2" class="input-group-addon">to-</span>
<input class="form-control input-sm" type="text" />
</div>
</div>
</form>
Ответ №2:
Вы могли бы добавить туда еще один элемент, например:
<div id="spacer"></div>
с таким стилем, как
#spacer { width: 14px; display:table-cell;}