2013-03-08 34 views
0

我有一個表似乎適應給定列中最長的文本字符串。我在每行中都有選擇標籤,這些標籤看起來很亂。有一個額外的列被添加到表中,右邊的邊框不顯示。如果我縮小了選擇標記的大小,表格格式正確,但我想讓表格符合下一列中最大選擇標記和最大按鈕的大小。謝謝。下面的代碼:Rails - 表格列的寬度受選擇框的影響

<table class="table table-bordered table-condensed"> 
<thead> 
<tr> 
    <th>Position</th> 
    <th>Allocation</th> 
    <th>Action</th> 
</tr> 
</thead> 

<% position_map = @cabinet.cabinet_position_map %> 
<% @cabinet.cabinet_type.usize.downto(1) do |i| %> 
<tr> 
    <td>Slot: <%= i %></td> 
    <% if position_map[i].nil? %> 
     <% cabinet_device_selection = @cabinet.devices_to_fit(position_map, i) %> 
     <% @selection_list = [ "Power", "I/O", "Interface", "Unusable", "Other", "Missing", "Reserve" ] %> 
     <% cabinet_device_selection.each do |device| %> 
      <% @selection_list << device.name %> 
     <% end %> 
     <% if position_map[i].nil? %> 
       <%= form_tag({:controller => :cabinets, :action => :update_device_position, :position => i , :id => @cabinet.id } , { :method => 'get', :class => "form-search" }) do %> 
        <td> 
         <%= select_tag :position_name, options_for_select(@selection_list) %> 
        </td> 
        <td> 
         <%= hidden_field_tag 'position', i %> 
         <%= submit_tag "Add" , :class => "btn" %> 
        </td> 
       <% end %> 
     <% end %>    
    <% else %> 
     <% position_map[i].each do |cabinet_item| %> 
      <td> 
       <%= cabinet_item.name %>&nbsp; 
      </td> 
      <td> 
       <%= link_to "Remove", { :controller => :cabinets, :action => :remove_cabinet_position, :id => @cabinet.id, :position => i}, :class => "btn btn-danger" %> 
      </td> 
     <% end %> 
    <% end %> 
</tr> 
<% end %> 
</table> 

而這裏的輸出是什麼樣子:

Ill formatted image

+0

?是否有可能將該紅寶石代碼轉換爲HTML併發布?我的意思是,你可以通過Chrome開發人員工具 – Learner 2013-03-08 17:28:19

回答

0

看來你正在使用引導。

所以,要改變select_tag的寬度,你可以簡單地做。或者,如果您想設置自定義寬度,請在您的css中添加一個類。

.option-small { 
     width: 100px !important; 
    } 

然後使用任何CSS u使用

<%= select_tag :position_name, options_for_select(@selection_list), :class => "option-small" %> 
+0

獲得這個Ruby代碼的html代碼。嘿喬...有幫助嗎?如果是,你會介意接受答案嗎? :) – Bot 2013-03-13 09:05:05

相關問題