用于复选框的 Wordpress Gravity Form CSS

Question

我在此处添加了一个 Wordpress 表单:http://goo.gl/6UtIgr

在表格的第二页:我有几个复选框组，每个复选框组有 2 个元素。

我希望它们在 3 列布局上对齐所以我使用了 Ready 类 gf_list_3col

.gform_wrapper li.gfield.gf_list_3col ul.gfield_checkbox li 
{
  width: 33%;
  float: left;
  margin: 0 0 8px 0;
  min-height: 1.8em;
  clear: left !important;
  margin-left: 0 !important;
}

但是好像不行。

请给出解决方案

Answer 1

对于具有三个输入的复选框组，您需要删除 float 并添加 display: inline-block;:

.gform_wrapper li.gfield.gf_list_3col ul.gfield_checkbox li {
    width: 33%;
    float: none;
    margin: 0 0 8px 0;
    min-height: 1.8em;
    display: inline-block;
}

如果您希望具有两个输入的组遵循完全相同的网格，则必须使用 .gform_wrapper li.gfield.gf_list_2col ul.gfield_checkbox li 来定位它们:

.gform_wrapper li.gfield.gf_list_2col ul.gfield_checkbox li {
    width: 33%;
    float: none;
    margin: 0 0 8px 0;
    min-height: 1.8em;
    display: inline-block;
}

如果您希望同时定位两者，显然可以将它们结合起来。