Centering DIV in CSS only works on footer

Not sure why my content isn't centering?

Page 1 of 1

1 Replies - 687 Views - Last Post: 24 December 2010 - 01:38 PM

#1 bmcc81  Icon User is offline

  • D.I.C Regular

Reputation: 2
  • View blog
  • Posts: 312
  • Joined: 10-July 07

Centering DIV in CSS only works on footer

Posted 24 December 2010 - 01:20 PM

Hi,

I'm having trouble getting my web site to center. I've built this with div's and thought I just needed to set the body in CSS to center it, but it's not working...

Here is my CSS code:

body {
	margin: 0px auto;
	background-color:#006;
}

#header {
	margin: o auto;
	background-image:url(../images/header.png);
	width: 1038px;
	height: 190px;
	}
	
#Menu {
	margin: o auto;
	background-image:url(../images/Menu.png);
	width: 1038px;
	height: 66px;
	}
	
#wrap1 {
	margin: o auto;
	width: 1038px;
	height: 382px;
	}
	
#Package1 {
	float:left;
	background-image:url(../images/Packages_1.png);
	width: 280px;
	height: 382px;
	}
	
#Package2 {
	float:left;
	background-image:url(../images/Packages_2.png);
	width: 239px;
	height: 382px;
	}
	
#Package3 {
	float:left;
	background-image:url(../images/Packages_3.png);
	width: 239px;
	height: 382px;
	}

#Package4 {
	float:left;
	background-image:url(../images/Packages_4.png);
	width: 280px;
	height: 382px;
	}

#wrap2 {
	margin: o auto;
	background-image:url(../images/Ink_Toner.png);
	width: 1038px;
	height: 261px;
	}
	
#wrap3 {
	margin: o auto;
	background-image:url(../images/Left_MENU_Right_CONTENT.png);
	width: 1038px;
	height: 519px;
	}
	
.Left_Menu {
	margin: 0 0 0 0;
	width: 298px;
	height: 519px;
	}
		
.Right_Content {
	margin: 0 0 0 0;
	width: 298px;
	height: 519px;
	}
	
#Footer {
	clear:both;
	margin: 0 auto;
	background-image:url(../images/Footer.png);
	width: 1038px;
	height: 64px;
	}



And MY HTML:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Monsieur Web</title>
<link rel="stylesheet" type="text/css" href="css/default.css"/>
</head>
<body>

<!--Header Top-->
<div id="header"></div>

<!--Menu Top Horizontal-->
<div id="Menu"></div>

<!--Wrap 1 is for 4 Packages-->
<div id="wrap1">
<div id="Package1"></div>
<div id="Package2"></div>
<div id="Package3"></div>
<div id="Package4"></div>
</div>

<!--Wrap 2 is for Ink & Toner Middle Section-->
<div id="wrap2">
</div>

<!--Wrap 3 is for Joomla-->
<div id="wrap3">
<div class="Left_Menu"></div>
<div class="Right_Menu"></div>
</div>

<!-- Footer  -->
<div id="Footer"></div>
</body>
</html>


Can anyone see why I can't center this properly?

Thanks,
bmcc81

This post has been edited by bmcc81: 24 December 2010 - 01:21 PM


Is This A Good Question/Topic? 0
  • +

Replies To: Centering DIV in CSS only works on footer

#2 bmcc81  Icon User is offline

  • D.I.C Regular

Reputation: 2
  • View blog
  • Posts: 312
  • Joined: 10-July 07

Re: Centering DIV in CSS only works on footer

Posted 24 December 2010 - 01:38 PM

There was a TYPO in my CSS

	margin:0 auto;


The 0 was a "o"

My mistake!!!
Was This Post Helpful? 0
  • +
  • -

Page 1 of 1