How Can i make all elements in div centered HTML5 [closed] - html

Question

Closed. This question needs details or clarity. It is not currently accepting answers.
Want to improve this question? Add details and clarify the problem by editing this post.
Closed 9 years ago.
Improve this question
i have tried all other way search on stackoverflow etc but couldn't found my answer
my div id is loginbox.
<div id="loginbox">
<form action="post">
<table>
<tr>
<td><label>Username:</label></td>
<td><input id="username" type="text" placeholder="username"/></td>
</tr>
<tr>
<td><label>Password:</label></td>
<td><input id="password" type="password" placeholder="password"/></td>
</tr>
<tr>
<td></td>
<td><input type="submit" value="Login" /></td>
</tr>
</table>
</form>
</div>

Answer 1

I can't see your CSS, but considering just what's in your question, this should work:
#loginbox form table {
margin: 0 auto;
}
Demo: http://jsfiddle.net/TmY46/
And this isn't related to HTML5. It's purely CSS.

Answer 2

Depending on what exactly you want to have:
#loginbox table { margin:auto; }
or
#loginbox * { text-align:center; }
or
#loginbox table * { margin:auto; }
or any combination!?

Answer 3

First or all, you shouldnt use a table for that.
Anyway, something like that :
td{text-align:center;}
form input{display:block;margin:auto;}
If you really want to code in html5, i encourage you to use a different structure,
like :
<form>
<p><label>Username :</label><input type=text /><span style="clear:both"></span></p>
<p><label>Password :</label><input type=password /><span style="clear:both"></span></p>
<input type=submit vale="login" />
</form>
And in css :
form {margin:auto;}
form p{display:block;margin:3px 0;}
form input[type=text], form input[type=password]{float:left;width:150px;}
This is how i would do, it's cleaner and much flexible