浮动属性应该影响复选框的功能是否有原因？

Question

我有以下Rails表格

<%= simple_form_for @user do |f| %>
<ul class="publications">
  <% @citations.each do |publication| %>
      <li>
        <div class = "PublicationCheckbox"><%= check_box_tag "publications[]", publication[:id] %></div>
        <div class = "PublicationString">
             <b><%= publication[:title] %></b>
             <%= publication[:authors] %>.
             <i><%= publication[:journal] %></i>,
             <%= publication[:year] %>,
             <%= publication[:volume] %>:
             <%= publication[:pages] %>
        </div>
      </li>
  <% end %>
  <div class="actions">
    <%= f.submit "Add to profile" %>
  </div>

<%= link_to 'Show', @user %> |
<%= link_to 'Back', users_path %>

</ul>
<% end %>>

这是CSS

.publications {
    list-style: none;
    padding: 0;

    li {
        padding: 15px 0;
        border-top: 1px solid #e8e8e8;
        float: left;
       }

    .PublicationCheckbox{
        float: left;
       }

    .PublicationString {
        padding: 0px !important;
        padding-bottom: 10px !important;
        margin-left: 20px !important;
        float: left;
      }

      }

如上所示，复选框不会选中。如果我从他们工作的复选框中删除浮动属性。

Answer 1

不，浮动属性不会影响复选框的功能。但是，如果您浮动一个复选框，并且它附近的另一个元素具有更高的 z-index 值和填充或边距，有时您可以在复选框上获得一个不可见的层，不允许您 select 它。

我建议您使用 Chrome 开发工具检查复选框，看看复选框顶部是否有任何内容。您可能需要调整复选框的 z-index，使其位于最上层。

浮动属性应该影响复选框的功能是否有原因？

Is there are reason why the float property should impact the functioning of a check box?

html

css

checkbox

ruby-on-rails

z-index

浮动 属性 应该影响复选框的功能是否有原因？

Is there are reason why the float property should impact the functioning of a check box?

html

css

checkbox

ruby-on-rails

z-index

浮动属性应该影响复选框的功能是否有原因？