Bootstrap 输入未对齐

Question

我正在尝试为我的输入之一添加前缀，但我的问题是添加的位置不正确

这是我的 html:

<div class="form-group"> <label>Avsändare</label> <input type="text" class="form-control" id="sender_input"> </div>
            <div class="form-group"> <label>Mottagare</label> <div class="input-group-prepend">
<span class="input-group-text" id="inputGroup-sizing-default">Default</span>

梅德兰德：

JSFiddle：https://jsfiddle.net/gcbL1e0a/2/

Answer 1

简短回答：input-group-prepend 只在 input-group 内有效。

修改您的代码如下 (working fiddle here):

<div class="form-group">
    <label>Mottagare</label>
    <div class="input-group">
        <div class="input-group-prepend">
            <span class="input-group-text" id="inputGroup-sizing-default">Default</span>
        </div>
        <input type="tel" class="form-control" placeholder="+46000000000" id="recipient_input">
     </div>
</div>

这导致：

Bootstrap 输入未对齐

Bootstrap input not aligning

input

prepend

twitter-bootstrap