Bootstrap下拉菜单样式不正确

Question

我有一个问题，twitter/bootstrap下拉框没有被正确地设计。我在Rails 3，使用bootstrap-sass gem。下拉菜单功能正常，当我点击按钮时下拉，但没有样式。

基本上是这样的:broken

当它应该是这样的时候:working

这两个截图是两个月前从同一个代码库派生出来的不同应用程序。它们有相同的自定义CSS样式，其中任何一个都不会影响下拉菜单，并且工作的那个只导入警报，折叠，下拉菜单，模态和过渡引导插件，而坏的那个则使用一体化的bootstrap.js。我试过删除bootstrap.js并仅用这些插件替换它，但问题仍然存在。

下拉菜单也以同样的方式调用，通过局部渲染局部。

渲染:

<%= render :partial => 'layouts/dropdown', :locals => { :space => true, :collection => @statuses, :title => "Set Status", :subtitle => "Statuses:", :label => ->s{s}, :value => ->s{"&status=" + s}, :path => set_status_tickets_path, :id => "ticket-status", :type => :note } %>

分:

<div class="btn-group pull-right toggleCheck" style="display:none;" id='<%= id %>'>
  <a class="btn dropdown-toggle" data-toggle="dropdown" href="#"><%= title %><span class="caret"></span></a>
  <ul class="dropdown-menu" style="right: 0; left: auto;">
      <% if type == :search %>
        <li style="padding:5px 10px;"><input class="drop-search focus-open hold" type='text' placeholder='Search' style="margin:0px;"></li>
      <% elsif type == :note %>
        <li style="padding:5px 10px;"><textarea placeholder='Status notes' class="hold focus-open note-box" rows="4" style="margin:0px; resize: none;"></textarea></li>
      <% end %>
    <li style="padding:5px 10px; font-weight:700;"><%= subtitle %></li>
    <div class="choices">
    <% collection.each do |c| %>
      <li><%= link_to (label.(c) + '<span class="comment"></span>').html_safe, '#', :value => value.(c), :path => path, :iden => label.(c).downcase.gsub(/s/, '-') %></li>
    <% end %>
    </div>
  </ul>
</div>

有没有人能告诉我这里我可能做错了什么?这也是我的第一个问题，所以如果我做错了什么，或者没有包括足够的信息，让我知道。谢谢!

Answer 1

我明白了，问题出在<div class="choices">上。由于某种原因，在一个项目中，它没有继承dropdown-menu的风格，而在另一个项目中却继承了。

choices类是由javascript函数(用于选择)使用的，所以摆脱它不是一个选项。对于一个有点笨拙的解决方案，我只是在适当的位置添加choices类来引导CSS。