У меня проблема при попытке добавить надстройку начальной группы ввода в поле ввода, которое находится внутри тега таблицы <td>. При добавлении всех необходимых классов между знаком и полем ввода остается пробел.
<td>
<div class="form-group">
<div class="input-group">
<div class="input-group-addon">$</div>
<%= text_field_tag "variables[#{@home_price_budget.name}]", params.fetch(:variables, {}).fetch(@home_price_budget.name, ''), value: @home_price_budget.default.to_i, class: "form-control", type: 'number' %>
</div>
</div>
</td>
Результат: 
Как решить эту проблему? Благодарю.
0
3 Май 2016 в 11:08
2 ответа
Лучший ответ
Убедитесь, что вы не применяете поле для ввода формы, это может создать эту проблему, если вы делаете это в глобальной шкале CSS (все элементы ввода)
Вот простой JSFiddle показывает, как на это может повлиять простая маржа.
Html:
<div class="input-group">
<span class="input-group-addon" id="basic-addon1">@</span>
<input type="text" class="form-control" placeholder="input margin" aria- describedby="basic-addon1">
</div>
CSS:
input {
margin-left: 7px;
}
1
3 Май 2016 в 10:58
Используйте span вместо div, измените свой HTML как:
<td>
<div class="form-group">
<div class="input-group">
<span class="input-group-addon">$</span>
<%= text_field_tag "variables[#{@home_price_budget.name}]", params.fetch(:variables, {}).fetch(@home_price_budget.name, ''), value: @home_price_budget.default.to_i, class: "form-control", type: 'number' %>
</div>
</div>
</td>
0
3 Май 2016 в 08:20