Centering issues with IE and FF
Having trouble centering the body of your page in both Internet Explorer and Firefox?
When you style your body in CSS and you do a text align: center; Firefox will not center your page in the window. However, Internet explorer will center your page. Example CSS would look like:
body {
text-align:center;
margin: 0;
padding: 0;
}
text-align:center;
margin: 0;
padding: 0;
}
If you want to center your body in both browsers you need to encompass all your content in one div that has a margin: 0 auto;. What this means is that everything in that div will shift down 0px from the top and bottom, while auto adjusting to the center of your browser from the left and right. This holds true even while your page is moved in an out by the user if he/she resizes the window.
Example CSS code would look like this:
body {
text-align:center;
margin: 0;
padding: 0;
}
#main {
margin: 0 auto;
}
text-align:center;
margin: 0;
padding: 0;
}
#main {
margin: 0 auto;
}
And your HTML code would look like this:
<body>
<div id=”main”>
content will go here!
</div>
</body>
<div id=”main”>
content will go here!
</div>
</body>
Leave a Reply