如何使用CSS製作多選框，但標籤顯示在頂部而不是左側？

Question

我有一個Rails 3.2.8應用程序，我試圖自定義一些隨simple_form_for gem一起提供的類。

我有一個頁面上有許多選擇框，並且明智地使用空間我希望標籤出現在選擇框的頂部。

我不能完全弄清楚如何做到這一點。我有很少的CSS經驗，我試圖潛入。我已經使用float取得了一些成功，但是當您使用simple_form_for時，最終會爲表單元素添加一堆嵌套的<div>標記。因此，我的選擇框只在最左邊標記爲<div>。我希望它符合標籤。下面是一個呈現例子：

<div id="attribute_value_list" class="attribute_value_list"> 
    <div class="control-group select required"> 
    <label class="select required control-label" for="app_attribute1"> 
     <abbr title="required">*</abbr> 
     Vehicle: Make 
    </label> 
    <div class="controls"> 
     <select id="app_attribute1" class="select required select_attribute_value" size="10" name="app[attribute1]"> 
     ... 
     </select> 
    </div> 
    </div> 
</div> 

Answer 1

您需要申請的位置是：相對於包含分區（選擇一個保存在標籤和控件），然後位置是：絕對的標籤，用左邊是和頂部將它放在任何你想要的位置 - 相對於包含div。