8

I am trying to use Bootstrap for my website. I have radio buttons and I am trying to use "Buttons" from bootstrap for the same.

<td style="margin-bottom:0px; padding-bottom: 0px;font-size=12px;vertical-align:bottom;">
    <div class="btn-group" data-toggle="buttons" id="topButtonDiv" >
        <button type="button" class="btn btn-primary">Home
        <input type="radio" id="radio1" ></button>
        <button type="button" class="btn btn-primary">Home1
        <input type="radio" id="radio2" > </button>
        <button type="button" class="btn btn-primary">Home2
        <input  type="radio" id="radio7"> </button>                
     </div>
</td>

The problem I am facing is that I still see the circles in the Radio button present, where as in the Bootstrap example, I see no such circles present.

http://getbootstrap.com/javascript/#buttons-usage

Can you let me know what I am missing here?

4

3 に答える 3

4

追加した css のバージョンを確認します。ここでは同じbtn-groupクラスが正常に機能します

于 2013-09-10T09:19:59.717 に答える
1

ブートストラップ ラジオ ボタンのマークアップが間違っています。次のようにします。

<div class="radio">
<label>
<input type="radio" name="optionsRadios" id="optionsRadios1" value="option1" checked>
Option one is this and that&mdash;be sure to include why it's great
</label>
</div>

さらに、ボタン要素内に入力要素を配置することはできません。無効な html です。

于 2013-09-10T09:20:05.360 に答える