html tutorial - How to align a DIV horizontally center using CSS - html5 - html code - html form
Answer: Set the style rule "margin:0 auto;" for DIV
If you would like to align the <div> element horizontally center with respect to the parent element you can use the CSS margin property.
Example
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>Center Align Div Using CSS - html5 - html code - html form - In 30Sec by Microsoft Award MVP - | wikitechy</title>
<style type="text/css">
.container {
width: 100%;
margin: 0 auto;
padding: 22px;
background: #f0e68c;
}
</style>
</head>
<body>
<div class="container">
<h1>This is a heading</h1>
<p>This is a paragraph.</p>
</div>
</body>
</html>As you can see we have applied the auto value to the left and right margin property of the <div> element.
Note:This use to works when the width of parent element is containing <div> element that you want to align.