Posted on September 14, 2007
Filed Under CSS - Cascading Style Sheets | Leave a Comment
In the world of CSS there can be many headaches getting your page to do what you want. Today let me show you a trick that will save you some time getting your site to look the same in IE and Firefox. If you try to center a wrapper div on a page you may run into some issues with FireFox. I discovered a fix online and I hope this helps you as well. In short here is the solution: Â
Change the margin from margin: 0px; to margin: 0 auto;Â
When you make that change this will give the div an auto left and right margin. Combined with your div width this will cause it to center. Â
The following is some will create a div tag with the width of 600 px and will center. Â
<style>
#container
{
text-align: center;
}
#containercontent
{
width: 600px;
text-align: left;
padding:0px 0px 0px 0px;
margin: 0 auto;
}
</style>
<div id="container">
<div id="containercontent">
Test 123</div>
</div>Enjoy!
Posted on June 23, 2006
Filed Under CSS - Cascading Style Sheets, Web Design | Leave a Comment
I came across this CSS centering article when trying to figure out how to center a div tag in CSS. Works great!Â
Posted on June 23, 2006
Filed Under CSS - Cascading Style Sheets, Web Design | Leave a Comment
Here’s a chart that converts points to pixels (and ems and %). It’s an approximation, which will depend on font, browser and OS, but it’s a good starting point.