选择控制错位

问题描述

我之前已经成功使用过 selectize.js 库。然而，在目前的情况下，我遇到了一个奇怪的视觉错误。一旦我将 <div> <form id="login-form" autocomplete="on"> <input type="password" name="password" id="password-field" class="login-form-field" placeholder="Password Here"> <input type="submit" value="Family photoalbum" id="login-form-submit"> </form> <br> <div id="login-error-msg-holder"> <p id="login-error-msg">&nbsp;<br>Wrong Password<br>&nbsp;</p> </div> </div> 类应用到我的 selectize 下拉菜单（绿色框），它就会得到一个奇怪的偏移量，并且显示的选项也几乎是整洁的（参见红色框）。

这是 rails 应用程序的全部内容。这是我的 HTML 代码：

select

Coffee 脚本中的 JS 代码：

.list-group.m-b-md
  .list-group-item
    = simple_form_for new_item,url: idea_interactions_path,remote: true do |f|
      .input-group
        = f.input :sprint_id,as: :hidden
        = f.input :interaction_pairings,label: false,as: :select,collection: interaction_pairings(@sprint),input_html: {class: 'selectize'}

解决方法

罪魁祸首是 CSS 类 form-control 删除它解决了上述所有问题。