Question

我遇到的问题是Twitter / bootstrap下拉列表没有正确设置样式。我在Rails 3中，使用bootstrap-sass gem。下拉功能正常，当我点击按钮时会下降，但没有样式。

基本上看起来像这样：broken

当它看起来应该是这样的：working

这两个截图是两个月前从同一个代码库中分出的不同应用程序的截图。它们具有相同的自定义CSS样式，其中没有一个会影响下拉列表，而工作的样式只会导入警报，折叠，下拉，模态和转换引导插件，而破坏的则使用一体化引导程序。 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的样式，而另一个是。{1}}。

choices类由javascript函数（用于选择）使用，因此摆脱它不是一个选项。对于一个有点笨拙的解决方案，我只是在适当的位置将choices类添加到bootstrap的CSS中。

Bootstrap Dropdown没有正确的样式

1 个答案: