居中 Google 表单 CSS

Question

我在我的网站上嵌入了一个 google 表单，它被包裹在 div 中。我尝试将它与 CSS 居中，但它不起作用。有没有办法完成这个任务？

我的代码：

#googleForm {
 margin-left: auto;
 margin-right: auto;
}

<div id="googleForm"> 
  <iframe src="https://docs.google.com/forms....></iframe>
</div>

Answer 1

您可以将 text-align: center 添加到 ID 为 googleForm 的元素。您也可以安全地删除 margin-left 和 margin-right:

#googleForm {
  /*margin-left: auto;/*
  /*margin-right: auto;*/
  text-align: center;
}

<div id="googleForm">
  <iframe src="https://docs.google.com/forms....></iframe>
</div>

如果你想使用margin: 0 auto你必须设置元素的宽度：

#googleForm {
  width: 304px;
  margin: 0 auto;
}

<div id="googleForm">
  <iframe src="https://docs.google.com/forms....></iframe>
</div>

Center Google Form with CSS