将可单击的图标添加到内联表单引导程序

时间:2014-04-17 18:47:15

标签: css twitter-bootstrap-3

我想在第一个输入框之后(或在可能的情况下)添加可点击的当前位置按钮。我在输入框之后添加它并且在下一个输入框之前没有换行符时遇到问题。我见过输入框的例子但不是表格。

<form class="form-inline" id="get-directions-form">


    <input class="form-control" type="text" id="start">
    <span class="input-group-btn"><img class="current-location-marker" src="http://imgur.com/pGM46FY.png"></span>

    <label> End </label>
    <input class="form-control" type="text" id="end">

  <input class="btn btn-primary" id="submit-button" type='submit'></input>

</form>

1 个答案:

答案 0 :(得分:0)

这个怎么样?

<form class="form-inline" id="get-directions-form">
<span class="textbox" style="border: 1px solid black; padding: 5px;">
<input class="form-control" type="text" id="start" style="border: none; padding-bottom: 5px;">
<img class="current-location-marker" src="http://imgur.com/pGM46FY.png" style="height: 32px;">
</span>

<label> End </label>
<input class="form-control" type="text" id="end">
<input class="btn btn-primary" id="submit-button" type='submit'></input>
</form>

我将文本框和图像放在样式框中,看起来像文本框。