The center of the page is generally a headache, especially for beginners. Incompatibilities between browsers can also pose a major problem. Here's a common way to center the page horizontally.
See "Proficient in CSS" below.
HTML code:
Copy Code code as follows:
<body>
<div id= "wrapper" >
</div>
</body>
IE Center method:
Body {
Text-align:center;
min-width:760px;
}
#wrapper {
width:720px;
Text-align:left;
}
IE will mistake text-align:center for everything centered, not just text. Then, the contents of the container are again aligned to the left.
Non ie:
Copy Code code as follows:
#wrapper {
width:720px;
margin:0 Auto;
}
How to be compatible with IE and non ie as follows:
Copy Code code as follows:
#wrapper {
width:720px;
position:relative;
left:50%;
margin-left:-360px;
}
First, position the left edge of the container in the middle of the page, and then move it to the left half of its width.