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

Tags: html,css,forms,margin

Problem :

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;}

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

But this works:

{margin: 0 250px 0;}

Form here

Solution :

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).


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


    CSS Howto..

    How to have different table styles in CSS

    DOM How to add two divs (with jQuery inside them) next to each other?

    How do I get an element to always occupy a specific percentage of its parent element, even when the browser is resized?

    How to default toggle to open using css/jquery?

    Show a gif image over a section to take up the space

    CSS: How to position divs 2 by 2

    How to set gulp autoprefixer that it will be prefix css when I save my project

    how to display data in html

    HTML: How to style each table cell in a column via CSS?

    How can I use .htaccess to send distant expiry headers on CSS and JS files?

    How to get custom css to load after richfaces?

    How do I display content in a way like UICollectionView on the web?

    How to make JqueryUi Slider vertical-align middle?

    How to get the navigation element to have horizontal lines after each nav element in css

    CSS: How to align buttons and text horizontally

    how to apply jquery ui/css to forum field

    How to align text vertically

    How to detect CSS is turned off with PHP?

    How to define the color of characters in OL/LI lists via CSS, WITHOUT using any image bullets or any span tag?

    How to add a hover transition effect on the navigation?

    How can I force a table cell onto a new row

    How do I make the link in the back div clickable

    How to prevent fixed image from scrolling down?

    How to apply default CSS styling to all HTML pages

    How to select a non unique element through CSS

    How to programmatically download all contents of webpage, not only the source code in Java

    How to determine if a device is in portrait or landscape mode using CSS

    How to center the buttons and make them same size

    CSS : How to make two column right fluid left fluid depend on right

    how to make textarea looks like input[text] on form invalid