Steps to align textbox and label
Step 1: Center a div tag using margin as 0 auto.
Step 2: Align the label to right and make it float to left.
Step 3: Align the textbox to left and make it float to right.
Step 4: Make both label and textbox to inline-block.
HTML & CSS
<!DOCTYPE html>
<html>
<head>
<title>Centering a form</title>
</head>
<body>
<div class="form">
<label>Name</label>
<input type="text" name="name">
<label>Email</label>
<input type="text" name="email">
<label>Phone</label>
<input type="text" name="phone">
</div>
</body>
</html>
<style type="text/css">
.form {
margin: 0 auto;
width: 210px;
}
.form label{
display: inline-block;
text-align: right;
float: left;
}
.form input{
display: inline-block;
text-align: left;
float: right;
}
</style>
Live demo here: https://jsfiddle.net/durtpwvx/
Aravin