Bootstraap 3按钮/收音机和输入组中的按钮/提交

时间:2017-04-06 14:56:21

标签: html button twitter-bootstrap-3 radio-button

大家好,谢谢你的时间。

如何在“按钮/收音机”组旁边正确添加“按钮/提交”

image: Broken borders of buttons

再次感谢您的帮助。

<link href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css" rel="stylesheet"/>
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet"/>
<div class="input-group">
  <span class="input-group-addon"><i aria-hidden="true" class="fa fa-code-fork"></i></span>
  <input name="data[Domain][domain_name]" class="input-sm form-control" placeholder="Nouveau domaine" maxlength="25" id="DomainDomainName" type="text">
  <span class="input-group-addon"><small>ajouté à </small></span>
  <div class="input-group-btn" data-toggle="buttons">
    <label class="btn btn-sm btn-info active">
            <input name="data[Domain][type_domain]" id="DomainTypeDomain2" value="2" type="radio"> Location
        </label>
    <label class="btn btn-sm btn-info">
            <input name="data[Domain][type_domain]" id="DomainTypeDomain1" value="1" type="radio"> Service
        </label>
  </div>
  <div class="input-group-btn">
    <button class="btn-success btn-sm btn btn-default">
            <i aria-hidden="true" class="fa fa-plus-circle"></i>
        </button>
  </div>
</div>

1 个答案:

答案 0 :(得分:1)

Just add border-radius: 0px it will work.

Working snippet

#btnrad {
border-radius: 0px;
}
<link href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css" rel="stylesheet"/>
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet"/>
<div class="input-group">
  <span class="input-group-addon"><i aria-hidden="true" class="fa fa-code-fork"></i></span>
  <input name="data[Domain][domain_name]" class="input-sm form-control" placeholder="Nouveau domaine" maxlength="25" id="DomainDomainName" type="text">
  <span class="input-group-addon"><small>ajouté à </small></span>
  <div class="input-group-btn" data-toggle="buttons">
    <label id="btnrad" class="btn btn-sm btn-info active">
            <input name="data[Domain][type_domain]" id="DomainTypeDomain2" value="2" type="radio"> Location
        </label>
    <label id="btnrad" class="btn btn-sm btn-info">
            <input name="data[Domain][type_domain]" id="DomainTypeDomain1" value="1" type="radio"> Service
        </label>
  </div>
  <div class="input-group-btn">
    <button class="btn-success btn-sm btn btn-default">
            <i aria-hidden="true" class="fa fa-plus-circle"></i>
        </button>
  </div>
</div>