文本小部件中元素的大小和位置答案

【问题标题】：Size and position of an element in a text widget文本小部件中元素的大小和位置
【发布时间】：2018-09-25 02:51:40
【问题描述】：

我无法居中和修改插入到位于我网站左页脚的文本小部件中的联系表单的高度。

我想降低表单的高度并将其水平居中。

我试过这个 CSS sn-p ：

/* Contact form customization */
.wpcf7{
  	height: 20%;
  	max-width: 50%;
  	margin: auto;
}

更改 max-width 属性确实会更改表单的宽度，但我无法使用通常的“margin: auto;”将其居中在小部件区域中把戏。

改变 height 属性没有任何作用。

编辑：按照 D_S_B 的建议，我尝试设置 div.wpcf7 的样式，但我的更改没有出现在我页面的 CSS 样式中。怎么回事？

非常感谢您的帮助，

本杰明

【问题讨论】：

【解决方案1】：

快速查看您的 css，看起来有样式应用于 div.wpcf7，以及您从 .wpcf7 发布的样式。

应用 div.wpcf7 的类比没有 div 选择器的类更具体，因此应用到类的任何边距都将被应用到 div.wpcf7 的边距覆盖：0。

如果您将您的课程范围限定为 div.wpcf7 并添加一个 margin: 0 auto ，那么它将按预期级联并为您水平居中您的表单。

【讨论】：

【解决方案2】：

我通过下载Contact Form 7 style plugin 解决了我的问题。它用额外的类包装表单，使定制变得容易。

【讨论】：