使用複選框進行選項佈局，然後div內聯

Question

我正在嘗試在網頁上佈置投票投票。

投票應顯示爲單選按鈕，然後顯示包含所有相關投票數據的<div>。在投票數據<div>內，我需要左邊的選項文本，然後右邊的百分比。這裏是佈局的基本視覺表現 -

我幾乎得到這個（！我認爲），但寬度是錯誤的，用的單選按鈕佔用太多的空間。它們應該只有需要的寬度，包含其餘數據的<div>直接佔據右側的其餘空間。

有人可以請建議如何改變我的CSS/HTML，使佈局，因爲我的願望？

這裏是鏈接到代碼 - http://jsfiddle.net/D4cqL/

Answer 1

寬度只需添加到您的顯示器容器：

.poll .poll-option-container .poll-option-display-container { 
    margin: 0 0 0 10px; 
    float: right; 
    width:93%; 
} 

我還添加了一個行高度複選框容器的垂直對齊：

.poll .poll-option-container .poll-option-checkbox-container { 
    height: 36px; 
    line-height:36px; 
    overflow: hidden; 
    padding-right: 1px; 
} 

希望它有助於

FIDDLE

Answer 2

.poll-option-checkbox-container input { 
    margin-top: 15px; 
}