HTML CSS表单 - 如何将表单放在页面中心？ [英] HTML CSS Form - How to center the form on the page?

问题描述

我制作了一个表单，我试图将它放在页面上，但它不工作。我尝试应用这两个CSS，但它没有工作。

I made a form and I am trying to center it on page but it doesn't work. I tried applying these 2 CSS to it but it didn't work.

form{margin: 0 auto;}

form{margin: auto;}

我还尝试将表单封装到div。

I also tried enclosing the form into div.container and applying same CSS to it but still nothing.

但这个工作原理：

{margin: 0 250px 0;}

表单这里

推荐答案

您需要做两件事要实现这一点：

You need to do two things to achieve this:

1）将 inline-block 更改为块。

2）修正宽度（您目前拥有 auto ）。

1) Change inline-block display on the form to be block.
2) Fix the width (you currently have it as auto).

演示： http://jsfiddle.net/bMf9M/2/

或者如果您不想修复表单大小，可以使用 text-align：center 感谢@donderpiet）

Or if you don't want to fix the form size, you can use text-align: center (Thanks @donderpiet)

演示： http：// jsfiddle .net / bMf9M / 4 /

这篇关于HTML CSS表单 - 如何将表单放在页面中心？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！