引導單選按鈕佈局

Question

使用v3.3.7

不管多久，我惹這個，我似乎無法得到正確完成此單選按鈕。它總是看起來很奇怪......在下面的代碼中，你會看到我正在試圖讓2個選項在內部相鄰，彼此相鄰。

但他們似乎掩蓋他們的標籤，實際投入是巨大的......

相關代碼：

<div class="col-md-6"> 
    <label>Gender</label> 
    <div> 
     <label class="radio-inline"> 
     <input type="radio" name="x_Gender" value="M" class="required form-control" title="*"> 
     Male 
     </label> 

     <label class="radio-inline"> 
     <input type="radio" name="x_Gender" value="F" class="required form-control" title="*"> 
     Female 
     </label> 
     </div> 
    </div> 

LINK：https://mizrachi.coda.co.il/radio.asp

非常感謝

Answer 1

你只需要刪除.form-control類，如果你想讓它們像這樣內聯。

http://getbootstrap.com/css/

所有文字<input>，<textarea>和<select>與.form-control元素被默認設置爲width: 100%;。

<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet"/> 
 
<div class="col-md-6"> 
 
    <label>Gender</label> 
 
    <div> 
 
    <label class="radio-inline"> 
 
     <input type="radio" name="x_Gender" value="M" class="required" title="*"> 
 
     Male 
 
    </label> 
 
    <label class="radio-inline"> 
 
     <input type="radio" name="x_Gender" value="F" class="required" title="*"> 
 
     Female 
 
    </label> 
 
    </div> 
 
</div>

Answer 2

只是刪除形式控制類的單選按鈕。