HTML CSS Form - How to center the form on the page?

Question

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{marg         


        

Answer 1

You need to do two things to achieve this:

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

Demo: http://jsfiddle.net/bMf9M/2/

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

Demo: http://jsfiddle.net/bMf9M/4/