引导输入未对齐

Question

我正在尝试添加我的输入内容之一，但是我的问题是，添加的内容未正确放置

它是这样的： https://prnt.sc/l7wf9y

这是我的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>

                   Meddelande：                 

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>

结果是：