Question

我在这里添加了一个Wordpress表单：http://goo.gl/6UtIgr

在表格的第二页上：我有几个复选框组，每组有2个项目。

让他们在3 col布局上对齐所以我使用了Ready class 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;
}

如果您希望将两者都作为目标，那么显然可以将它们结合起来。

Wordpress Gravity Form CSS复选框

1 个答案: