HTML center input buttons

Question

Here is my code:

        <p align="center">Do you want to play the game?</p><br>
        <Input type = 'Submit' Name ='StartQuiz' value="Yes" align="center">
        <Input type = 'Submit' Name ='LogOut' value="No" align="center">

The buttons are not in the center. Do I have to use CSS for this? I read on the net to just use the simple align tag.

How should I go about aligning these buttons to the center?

Answer 1

Align is deprecated on HTML5, so considered use CSS3 instead. The align attributte is to center the content and not the element itself.

The input element is inline-block by default, so, to center you need to put them inside a div as here:

<div style="text-align:center;">
    <input type="text" />
</div>

This is cause the inline-block elements share the same line with other elements and you need to center all elements that share the same line. The div element is a block element that display alone in one line.

So you have another option to center an input, and you can set to "display:block;" as here:

<input type="text" style="margin:0px auto; display:block;" />

See: http://jsfiddle.net/T4f3W/