在输入旁边放置按钮

时间:2015-06-18 14:26:54

标签: html css twitter-bootstrap

我有以下代码:

<div class="row">
    <div class="col-lg-12">
        <div class="form-group">
            <input class="form-control"><button class="btn btn-primary">Absenden</button>
        </div>
    </div>
</div>

我希望按钮位于输入旁边,如下图所示:enter image description here

2 个答案:

答案 0 :(得分:4)

{{Infobox song
| Name = ''Why This Kolaveri Di''
| Cover = 
| Caption- = Screenshot of the song
| Artist = [[Dhanush]]
| Album = [[3 (2012 Indian film)|3]]
| URL =
| A-side =
| B-side =
| country = India
| Released = 16 November 2011
| Format = [[Music download|Digital download]]
| track_no = 1
| Recorded = [[2011 in music|2011]] at [[Panchathan Record Inn and AM Studios|AM Studios]], [[Chennai]]
| Genre =
| Length = 4:09
| Label = [[Sony Music Entertainment|Sony Music]]
| Producer = [[Anirudh Ravichander]]
| Writer = [[Dhanush]]
| Composer = [[Anirudh Ravichander]]
| Language = [[Tanglish]]
| Chart position =
| prev =
| prev_no = 2
| Misc =
{{External music video|{{YouTube|YR12Z8f1Dh8|&quot;Why This Kolaveri Di&quot;}}|Type=song}}
}}

Demo

答案 1 :(得分:2)

您可以使用input-group

<div class="input-group">
  <input type="text" class="form-control">
  <span class="input-group-btn">
    <button class="btn btn-default" type="button">Abschicken</button>
  </span>
</div><!-- /input-group -->

Du kannst input-groupdafürnutzen:

<div class="input-group">
  <input type="text" class="form-control">
  <span class="input-group-btn">
    <button class="btn btn-default" type="button">Abschicken</button>
  </span>
</div><!-- /input-group -->