css - 文本小部件中元素的大小和位置

Question

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

http://www.durocketdescarottes.fr/

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

我试过这个 CSS 片段:

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

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

更改高度属性不会执行任何操作。

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

非常感谢您的帮助，

本杰明

Answer 1

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

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

如果您将类的范围限定为 div.wpcf7 并在其中添加一个 margin: 0 auto ，它将按预期层叠并水平居中您的表单。