# Centered columns not centering

**URL:** <https://forum.kirupa.com/t/centered-columns-not-centering/174363>\
**Category:** web dev\
**Created:** [January 5, 2006, 12:54am UTC](https://forum.kirupa.com/t/centered-columns-not-centering/174363 "2006-01-05T00:54:24Z")\
**Posts on this page:** 1\
**Page:** 1

<div class="post-metadata">

**Author:** ![morse](https://avatars.discourse-cdn.com/v4/letter/m/bbce88/32.png) [@morse](https://forum.kirupa.com/u/morse)\
**Post date:** [January 5, 2006, 12:54am UTC](https://forum.kirupa.com/t/centered-columns-not-centering/174363/1 "2006-01-05T00:54:24Z")

</div>

[http://kzc.morsedesigns.com/about/](http://kzc.morsedesigns.com/about/)  
[http://kzc.morsedesigns.com/style.css](http://kzc.morsedesigns.com/style.css)

I’m perplexed. This looks fine in Safari, but in IE the content begins at the center of the screen (instead of far left). In Firefox, the center div is also starting at the top, no idea why.

Ug I hate css.

Here’s the content of the style sheet. Any idea what’s wrong? I’m most worried about the IE problem ☹

```auto

html,body,h1,h2,h3,h4,h5,h6,div,p,p2 {
	margin:0;
	padding:0;
}

body {
	margin: 0px;
	padding: 0px;
	text-align: center;
	background-color: #060000;
	background-image: url('smear.gif');
	background-repeat: repeat-x;
	background-position: top;
}

#content {
	margin: 0px auto 26px auto;
	padding: 0;
	/*width: 720px;*/
}

#header {
	margin: 0px 0px 10px 0px;
	padding: 0px;
}

#nav {
	margin: 0;
	padding: 0;
}

#front {
	width: 720px;
	margin: 0px auto 25px auto;
	padding: 0;
	text-align: center;
	background-color: yellow;
}

.col-1 {
	width: 50px;
	margin: 0px;
	padding: 35px 0 0 0;
	position: absolute;
	text-align: right;
	background-color: yellow;
}

.col-2 {
	width: 504px;
	margin: 0 0 0 72px;
	padding: 15px 7px 15px 7px;
	position: absolute;
	background-color: #fff;
	text-align: left;
}

.col-3 {
	width: 150px;
	margin: 35px 0 0 608px;
	padding: 0px;
	position: absolute;
}

.about-image {
	margin: 0 0 5px 0;
	padding: 0px;
}

p {
	font-family: Helvetica, Arial, sans-serif;
	color: #000;
	font-size: 12px;
	font-weight: normal;
}

ul {
	margin: 0px;
	padding: 0px;
}

li {
	font-family: Helvetica, Arial, sans-serif;
	color: #000;
	font-size: 12px;
	font-weight: normal;
}

h1 {
	font-family: Helvetica, Arial, sans-serif;
	color: #939598;
	text-transform: uppercase;
	font-size: 14px;
	font-weight: bold;
}

h2 {
	font-family: Helvetica, Arial, sans-serif;
	color: #FF5C00;
	text-transform: uppercase;
	font-size: 14px;
	font-weight: bold;
	margin-bottom: 4px;
}

h3 {
	font-family: Helvetica, Arial, sans-serif;
	color: #FF5C00;
	text-transform: uppercase;
	font-size: 14px;
	font-weight: bold;
	margin-bottom: 12px;
}

.sIFR-flash, .sIFR-flash object, .sIFR-flash embed {
	display: none !important;
	height: 0;
	width: 0;
	position: absolute;
	overflow: hidden;
}

span.sIFR-alternate {
	visibility: visible !important;
	display: block !important;
	position: static !important;
	left: auto !important;
	top: auto !important;
}

/* Do not modify */

.sIFR-flash { visibility: visible !important; margin: 0; }
.sIFR-replaced { visibility: visible !important; }
span.sIFR-alternate { position: absolute; left: 0; top: 0; width: 0; height: 0; display: block; overflow: hidden; }

/* Modify */
/*
.sIFR-hasFlash h1 {
	visibility: hidden;
}
*/
.sIFR-hasFlash h2 {
	visibility: hidden;
	letter-spacing: 0px;
	font-size: 15px;
}

.sIFR-hasFlash h3 {
	visibility: hidden;
	letter-spacing: 0px;
	font-size: 17px;
}
/*
.sIFR-hasFlash h4 {
	visibility: hidden;
	letter-spacing: -5px;
	font-size: 21px;
}

.sIFR-hasFlash h5#pullquote {
	letter-spacing: -4px;
	visibility: hidden;
	font-size: 24px;
}*/

```