如何定位輸入類型無線電和複選框內聯位置？

我想我的定位單選按鈕和checkboxes線位置我用這個css代碼，但沒有奏效如何定位輸入類型無線電和複選框內聯位置？

CSS

.checkbox-inline, .radio-inline { 
    cursor: pointer; 
    display: inline-block; 
    font-weight: 400; 
    margin-bottom: 0; 
    padding-left: 20px; 
    position: relative; 
    vertical-align: middle; 

} 
input[type=radio] { 
    margin-left: -20px; 
    position: absolute; 
}

HTML

<div> 
<label> <b>carburant: </b><span>(*)</span></label> 
    <label class ='radio-inline'><input type='radio' name='carburant' value=1 checked> AA</label> 
<label><input class ='radio-inline' type='radio' name='carburant' value=2> BB</label> 
<label><input class ='radio-inline' type='radio' name='carburant' value=3> CC</label> 
<label><input class ='radio-inline' type='radio' name='carburant' value=4> DD</label> 
</div><br /> 




<div> 
    <label> <b>city: </b><span>(*)</span></label> 
     <label class ='checkbox-inline'><input type='checkbox' name='carburant' value=1 checked> AA</label> 
    <label><input class ='checkbox-inline' type='checkbox' name='carburant' value=2> BB</label> 
    <label><input class ='checkbox-inline' type='checkbox' name='carburant' value=3> CC</label> 
    <label><input class ='checkbox-inline' type='checkbox' name='carburant' value=4> DD</label> 
    </div><br />

我不使用twitter bootstrap，我正在使用html5。我想在同一行顯示我的按鈕。

謝謝。

來源

2015-09-09 Guns_Roses

什麼叫線位置是什麼意思？你想要標籤文字旁邊的收音機？ – Aaron

複選框在哪裏？ –

什麼「沒有工作」？你能否描述你的問題要好一點。單選按鈕默認是內聯的。爲什麼添加20px左邊距然後邊距爲-20px，第一個類是在標籤上，而其餘的是在輸入上 - 你認爲哪一個要添加類？ – Pete

你的問題不是很清楚，但我想你想你的內嵌單選按鈕，我希望下面的解決方案將幫助您。

.checkbox-inline, .radio-inline { 
 
    cursor: pointer; 
 
    font-weight: 400; 
 
    margin-bottom: 0; 
 
    padding-left: 20px; 
 
}

<div > 
 
<label> <b>carburant: </b><span>(*)</span></label> 
 
    <label class ='radio-inline'><input type='radio' name='carburant' value=1 checked> AA</label> 
 
<label><input class ='radio-inline' type='radio' name='carburant' value=2> BB</label> 
 
<label><input class ='radio-inline' type='radio' name='carburant' value=3> CC</label> 
 
<label><input class ='radio-inline' type='radio' name='carburant' value=4> DD</label> 
 
</div><br />

來源

2015-09-09 09:24:48

問題來自CSS屬性分配給input[type=radio]標記，將它們全部刪除，然後讓您的複選框正確坐在一起......這裏是鏈接;

Radio Inlins

來源

2015-09-09 09:20:56

如何定位輸入類型無線電和複選框內聯位置？

回答

相關問題