联系表格 7 接受框和文本 CSS 样式

bob*_*ck4 0 css contact-form-7

我有 CF7 WP 插件。

我将接受短代码 [acceptance Acceptance-524] 和解释文本放在后面。

我已经尝试了几种 CSS 解决方案,但我无法避免第一行的行高较高以及第一行下方的行返回

问题截图如下:

在此输入图像描述

小智 6

使用这个CSS它工作正常

 .wpcf7-acceptance{



 input[type="checkbox"] {
    position: relative;
    cursor: pointer;
    padding: 0;
    margin-right: 15px;
    width: 20px;
}
input[type="checkbox"]:before {
    content: '';
    margin-right: 10px;
    display: inline-block;
    margin-top: -2px;
    width: 20px;
    height: 20px;
    background: #fcfcfc;
    border: 1px solid #aaa;
    border-radius: 2px;
}


 input[type="checkbox"]:checked:before {
    background: #000;
    border-color: #000;
}
 input[type="checkbox"]:disabled {
    color: #b8b8b8;
    cursor: auto;
}
 input[type="checkbox"]:disabled:before {
    box-shadow: none;
    background: #ddd;
}
 input[type="checkbox"]:checked:after {
    content: '';
    position: absolute;
    left: 5px;
    top: 8px;
    background: white;
    width: 2px;
    height: 2px;
    box-shadow: 2px 0 0 white, 4px 0 0 white, 4px -2px 0 white, 4px -4px 0 white, 4px -6px 0 white, 4px -8px 0 white;
    transform: rotate(45deg);
}


 span.wpcf7-list-item{
   margin: 20px 0 0 0;
}

}
Run Code Online (Sandbox Code Playgroud)