Centering my website!

Alnero · 04-05-2009, 10:33 AM

I've been working on a website for myself for over 2 weeks now and everything was going fine, graphic and code wise, until I noticed that my page wasn't centered. I tried everything I could but to no avail - something was missing but I didn't know what and still don't. That's why I decided to finally ask for help.

Just to let you know, I wanted to work with AP Divs instead of TABLE (I know I can center it using TABLE).

Here is the Code:

Code:

<!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=iso-8859-1" />
<title>Welcome to M.A.D!</title>
<style type="text/css">
<!--

#Layer1 **
	position:absolute;
	left:250px;
	top:0px;
	width:728px;
	height:800px;
	z-index:1;
	background-image: url(images/images/images/web_3000.png);
	background-repeat: no-repeat;
	bottom: 0px;
	right: auto;
	margin-top: 0px;
	margin-right: auto;
	margin-bottom: 0px;
	margin-left: auto;
}
#Layer2 **
	position:absolute;
	left:450px;
	top:166px;
	width:307px;
	height:22px;
	z-index:2;
}
#Layer3 **
	position:absolute;
	left:381px;
	top:218px;
	width:420px;
	height:236px;
	z-index:3;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	font-weight: normal;
	color: #909FAF;
	padding: 5px;
}
#Layer4 **
	position:absolute;
	left:393px;
	top:780px;
	width:508px;
	height:13px;
	z-index:4;
	font-size: 10px;
	color: #909FAF;
	font-family: Arial, Helvetica, sans-serif;
	border-bottom-style: solid;
	border-top-width: 1px;
	border-bottom-width: 1px;
	border-top-color: #909FAF;
	border-bottom-color: #909FAF;
}
#Layer5 **
	position:absolute;
	left:415px;
	top:99px;
	width:384px;
	height:63px;
	z-index:5;
}
#Layer6 **
	position:absolute;
	left:399px;
	top:0px;
	width:419px;
	height:90px;
	z-index:6;
}
#Layer7 **
	position:absolute;
	left:884px;
	top:10px;
	width:45px;
	height:16px;
	z-index:5;
}
.style1 a:link **
	font-size: 12px;
	color: #5F7588;
	text-decoration: none;
	display: list-item;
	list-style-type: circle;
}
.style1 a:hover **
	color:#909FAF;
	text-decoration: underline;
	list-style-type: disc;
}
-->
</style>
<script type="text/JavaScript">
<!--
function MM_swapImgRestore() ** //v3.0
  var i,x,a=document.MM_sr; for(i=0;a&&i<a.length&&(x=a[i])&&x.oSrc;i++) x.src=x.oSrc;
}

function MM_preloadImages() ** //v3.0
  var d=document; if(d.images)** if(!d.MM_p) d.MM_p=new Array();
    var i,j=d.MM_p.length,a=MM_preloadImages.arguments; for(i=0; i<a.length; i++)
    if (a[i].indexOf("#")!=0)** d.MM_p[j]=new Image; d.MM_p[j++].src=a[i];}}
}

function MM_findObj(n, d) ** //v4.01
  var p,i,x;  if(!d) d=document; if((p=n.indexOf("?"))>0&&parent.frames.length) **
    d=parent.frames[n.substring(p+1)].document; n=n.substring(0,p);}
  if(!(x=d[n])&&d.all) x=d.all[n]; for (i=0;!x&&i<d.forms.length;i++) x=d.forms[i][n];
  for(i=0;!x&&d.layers&&i<d.layers.length;i++) x=MM_findObj(n,d.layers[i].document);
  if(!x && d.getElementById) x=d.getElementById(n); return x;
}

function MM_swapImage() ** //v3.0
  var i,j=0,x,a=MM_swapImage.arguments; document.MM_sr=new Array; for(i=0;i<(a.length-2);i+=3)
   if ((x=MM_findObj(a[i]))!=null){document.MM_sr[j++]=x; if(!x.oSrc) x.oSrc=x.src; x.src=a[i+2];}
}
//-->
</script>
<link href="images/images/images/links_decoration.css" rel="stylesheet" type="text/css" />
</head>

<body>
<div id="Layer1"></div>
<div id="Layer2"><a href="Home.html" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('home','','images/images/images/menuRoll_01.png',0)"><img src="images/images/images/menuBTN_01.png" name="home" width="89" height="22" border="0" id="home" /></a><a href="Anime.html" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('anime','','images/images/images/menuRoll_02.png',0)"><img src="images/images/images/menuBTN_02.png" name="anime" width="63" height="22" border="0" id="anime" /></a><a href="Manga.html" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('manga','','images/images/images/menuRoll_03.png',0)"><img src="images/images/images/menuBTN_03.png" name="manga" width="70" height="22" border="0" id="manga" /></a><a href="About.html" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('about','','images/images/images/menuRoll_04.png',0)"><img src="images/images/images/menuBTN_04.png" name="about" width="85" height="22" border="0" id="about" /></a></div>
<div id="Layer3">
  <p>Hello!</p>
  <p>Welcome to my site...</p>
</div>
<div id="Layer4">
  <div align="center">Copyright &copy; 2009 M.A.D.net Designed by ???. All right reserved.</div>
</div>
<div class="style1" id="Layer7"><a href="contact.html">Contact</a></div>
</body>
</html>

Any help is appreciated. Thanks beforehand.

maretard · 04-05-2009, 03:55 PM

Hmm, that's odd. I just tested your code, and everything's perfectly centered to me. o_O
Granted, I can't see the images, but the missing image boxes and the text all line up as intended. Are you sure it's not centering?

**dm01** · 04-05-2009, 06:10 PM

Place this above the div#Layer1 in your internal CSS:

Code:

body {text-align: center}

If you want to change the text alignment for any element, use "left" or "right" as necessary. CSS uses specific hierarchy to "decide" which formatting to apply. The order is, generally speaking:

External CSS

Internal CSS <-- what this is
In-line CSS

Such that if the internal CSS differs from the external CSS, the browser will display the page as the internal CSS commands; likewise, if the in-line CSS differs from the internal CSS or the external CSS, then the browser will format the page as the internal CSS commands.

On the page:

<body>

<div>
<p>
<span>

The above is fairly simplified, if you want more details please post back and I will be happy to provide them.

Alnero · 04-05-2009, 07:11 PM

Quote:

Originally Posted by maretard

Hmm, that's odd. I just tested your code, and everything's perfectly centered to me. o_O
Granted, I can't see the images, but the missing image boxes and the text all line up as intended. Are you sure it's not centering?

Yeah, it's not and I don't know why.

Quote:

Place this above the div#Layer1 in your internal CSS:

Code:

body {text-align: center}

If you want to change the text alignment for any element, use "left" or "right" as necessary. CSS uses specific hierarchy to "decide" which formatting to apply. The order is, generally speaking:

External CSS

Internal CSS <-- what this is

In-line CSS

Such that if the internal CSS differs from the external CSS, the browser will display the page as the internal CSS commands; likewise, if the in-line CSS differs from the internal CSS or the external CSS, then the browser will format the page as the internal CSS commands.

On the page:

<body>

<div>

<p>

<span>

The above is fairly simplified, if you want more details please post back and I will be happy to provide them.

Thanks for the little info. As you can see from the code I posted I'm fairly new to this. I even forgot to clean up the CSS code a bit so that it wouldn't confuse you.

I tried the "body {text-align: center}" but all that managed to do was center my text and not the whole layout.

I know it can be done, because, I've seen some sites constructed completely with divs and still centered. Have I messed something up with the CSS or am I missing some HTML code?

**dm01** · 04-05-2009, 08:39 PM

Ahh, yes. I'm sorry, I misunderstood.

The solution is less simple, but still easy. You need a containing <div> for all of your other <div>s.

HTML Code:

<body>
<div id="container"
<!--other divs-->
</div><!--#container-->
</body>

The CSS for this div is:

Code:

#container{
height: 100%;
width: 100%;
margin: auto;
}

maretard · 04-05-2009, 10:11 PM

Props to dm01. :)

Okay, so... why exactly are Chrome, Mozilla, and Internet Explorer all telling me that the OP's original code is already centered? :(

**dm01** · 04-05-2009, 11:02 PM

Quite simply, they are guessing. In this case they happen to guess correctly as to the deveoper's intention, but they don't always.

Opera, on the other hand, never guesses. This is the (main) reason why Opera is "incompatible" with some sites (they are too lazy/ignorant to do a good job), and why Opera is considered by many to be the best browser for web design/development (no surprises afterwards).

Alnero · 04-06-2009, 09:04 AM

Quote:

Originally Posted by dm01

Ahh, yes. I'm sorry, I misunderstood.

The solution is less simple, but still easy. You need a containing <div> for all of your other <div>s.

HTML Code:

<body>
<div id="container">
<!--other divs-->
</div><!--#container-->
</body>

The CSS for this div is:

Code:

#container{
height: 100%;
width: 100%;
margin: auto;
}

I hate to be a pain but that didn't help either. I did what you said and still nothing. =[

**dm01** · 04-06-2009, 03:30 PM

Just to be absolutley clear, this is:

HTML Code:

<body>
<div id="container">
<div id="Layer1"></div>
<div id="Layer2"><a href="Home.html" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('home','','images/images/images/menuRoll_01.png',0)"><img src="images/images/images/menuBTN_01.png" name="home" width="89" height="22" border="0" id="home" /></a><a href="Anime.html" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('anime','','images/images/images/menuRoll_02.png',0)"><img src="images/images/images/menuBTN_02.png" name="anime" width="63" height="22" border="0" id="anime" /></a><a href="Manga.html" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('manga','','images/images/images/menuRoll_03.png',0)"><img src="images/images/images/menuBTN_03.png" name="manga" width="70" height="22" border="0" id="manga" /></a><a href="About.html" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('about','','images/images/images/menuRoll_04.png',0)"><img src="images/images/images/menuBTN_04.png" name="about" width="85" height="22" border="0" id="about" /></a></div>
<div id="Layer3">
  <p>Hello!</p>
  <p>Welcome to my site...</p>
</div>
<div id="Layer4">
  <div align="center">Copyright &copy; 2009 M.A.D.net Designed by ???. All right reserved.</div>
</div>
<div class="style1" id="Layer7"><a href="contact.html">Contact</a></div>
</div><!--#container-->
</body>
</html>

If it still doesn't work, you're going to have to set the margin values manually as percentages.

Alnero · 04-06-2009, 04:12 PM

I tried it again and still nothing. I guess there's no choice but to try and set the margin values manually as you said. Although, I've no idea what percentages to give them and would I have to do that for all the <div>s or just the main <div> (#Layer1)?

**dm01** · 04-06-2009, 07:51 PM

You set the left and right margins of div#container only. Editing other margins may cause unexpected and rather . . . interesting effects.

Code:

margin-left: auto;
margin-right: auto;

Code:

margin-left: 10%;
margin-right: 10%;

play with the above percent values to come up with something reasonable

Alnero · 04-07-2009, 03:59 AM

I played around with it a bit more after trying what you suggested and I'm still not getting any results.

Here, I've cleaned the code a bit, see if it'll work for you? When I preview it in Firefox it's more to the left than the right - same thing in IE.

Code:

<!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=iso-8859-1" />
<title>Welcome to M.A.D!</title>
<style type="text/css">
<!--
#container{
	margin-left: auto;
	margin-right: auto;
	margin-left: 50%;
	margin-right: 50%;
}
#body{
	position:absolute;
	left:250px;
	top:0px;
	width:728px;
	height:800px;
	z-index:1;
	background-image: url(images/images/images/web_3000.png);
	background-repeat: no-repeat;
	bottom: 0px;
	right: auto;
	margin-top: 0px;
	margin-right: auto;
	margin-bottom: 0px;
	margin-left: auto;
}
#menu{
	position:absolute;
	left:450px;
	top:166px;
	width:307px;
	height:22px;
	z-index:2;
}
#content{
	position:absolute;
	left:381px;
	top:218px;
	width:420px;
	height:236px;
	z-index:3;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	font-weight: normal;
	color: #909FAF;
	padding: 5px;
}
#copyright{
	position:absolute;
	left:393px;
	top:780px;
	width:508px;
	height:13px;
	z-index:4;
	font-size: 10px;
	color: #909FAF;
	font-family: Arial, Helvetica, sans-serif;
	border-bottom-style: solid;
	border-top-width: 1px;
	border-bottom-width: 1px;
	border-top-color: #909FAF;
	border-bottom-color: #909FAF;
}
#contact{
	position:absolute;
	left:884px;
	top:10px;
	width:45px;
	height:16px;
	z-index:5;
}
.style1 a:link{
	font-size: 12px;
	color: #5F7588;
	text-decoration: none;
	display: list-item;
	list-style-type: circle;
}
.style1 a:hover{
	color:#909FAF;
	text-decoration: underline;
	list-style-type: disc;
}
-->
</style>
<script type="text/JavaScript">
<!--
function MM_swapImgRestore() } //v3.0
  var i,x,a=document.MM_sr; for(i=0;a&&i<a.length&&(x=a[i])&&x.oSrc;i++) x.src=x.oSrc;
}

function MM_preloadImages() ** //v3.0
  var d=document; if(d.images)} if(!d.MM_p) d.MM_p=new Array();
    var i,j=d.MM_p.length,a=MM_preloadImages.arguments; for(i=0; i<a.length; i++)
    if (a[i].indexOf("#")!=0)** d.MM_p[j]=new Image; d.MM_p[j++].src=a[i];}}
}

function MM_findObj(n, d) ** //v4.01
  var p,i,x;  if(!d) d=document; if((p=n.indexOf("?"))>0&&parent.frames.length) }
    d=parent.frames[n.substring(p+1)].document; n=n.substring(0,p);}
  if(!(x=d[n])&&d.all) x=d.all[n]; for (i=0;!x&&i<d.forms.length;i++) x=d.forms[i][n];
  for(i=0;!x&&d.layers&&i<d.layers.length;i++) x=MM_findObj(n,d.layers[i].document);
  if(!x && d.getElementById) x=d.getElementById(n); return x;
}

function MM_swapImage() ** //v3.0
  var i,j=0,x,a=MM_swapImage.arguments; document.MM_sr=new Array; for(i=0;i<(a.length-2);i+=3)
   if ((x=MM_findObj(a[i]))!=null){document.MM_sr[j++]=x; if(!x.oSrc) x.oSrc=x.src; x.src=a[i+2];}
}
//-->
</script>

</head>

<body lang="en">
<div id="container">
<div id="body"></div>
<div id="menu"><a href="Home.html" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('home','','images/images/images/menuRoll_01.png',0)"><img src="images/images/images/menuBTN_01.png" name="home" width="89" height="22" border="0" id="home" /></a><a href="Anime.html" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('anime','','images/images/images/menuRoll_02.png',0)"><img src="images/images/images/menuBTN_02.png" name="anime" width="63" height="22" border="0" id="anime" /></a><a href="Manga.html" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('manga','','images/images/images/menuRoll_03.png',0)"><img src="images/images/images/menuBTN_03.png" name="manga" width="70" height="22" border="0" id="manga" /></a><a href="About.html" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('about','','images/images/images/menuRoll_04.png',0)"><img src="images/images/images/menuBTN_04.png" name="about" width="85" height="22" border="0" id="about" /></a></div>
<div id="content">
  <p>Hello!</p>
  <p>Welcome to my site. This is where I'll be adding links to various  good anime and manga sites. I'll also be reviewing certain titles -  in this case I'll focus more on the popular ones like (the undieing)  Dragon Ball Z, Fullmetal Alchemist, Code Geass, Naruto, Bleach and so  on. Be sure to visit often for new updates.</p>
</div>
<div id="copyright">
  <div align="center">Copyright &copy; 2009 M.A.D.net Designed by Lum. All right reserved.</div>
</div>
<div class="style1" id="contact"><a href="contact.html">Contact</a></div>
</div>
</body>
</html>

Alnero · 04-08-2009, 02:34 AM

I tried centering a <div> in a new page and it worked. So, it can be done but for some reason it's not working on my other pages. I think the reason why is probably because my code is a mess and something is overriding the #container <div>'s commands (align="center").

Still, I think I'm going to give up on trying to center it. It is roughly centered so I'll leave it like that for now. Thanks for all your help.

**dm01** · 04-08-2009, 02:43 AM

Delete one of the sets of margins, they are conflicting with each other and causing a mess. Either

Code:

margin-left: auto;
margin-right: auto;

or

Code:

margin-left: 50%;
margin-right: 50%;

should be deleted.

Alnero · 04-08-2009, 02:18 PM

I tried that and neither worked, but honestly it's ok. I think I'm going to leave as it is because, I haven't much time to complete it.Thanks for all your help so far.

04-05-2009, 03:55 PM	#2 (permalink)
maretard Registered User Join Date: Dec 2007 Location: Georgia Posts: 74 OS: Windows XP Home Edition, SP3 My System	Re: Centering my website! Hmm, that's odd. I just tested your code, and everything's perfectly centered to me. o_O Granted, I can't see the images, but the missing image boxes and the text all line up as intended. Are you sure it's not centering? __________________ I'm ridin' dirty. Oh baby, I'm yellow and nerdy.

04-05-2009, 06:10 PM	#3 (permalink)
dm01 Moderator: Design Join Date: Oct 2006 Location: Richmond, B.C.; Canada Posts: 1,466 OS: Windows XP [Version 5.1.2600] SP3 \| Ubuntu Jaunty Jackalope \| Windows 7 Ultimate (MSDNAA I <3 you) My System	Re: Centering my website! Place this above the div#Layer1 in your internal CSS: Code: body {text-align: center} If you want to change the text alignment for any element, use "left" or "right" as necessary. CSS uses specific hierarchy to "decide" which formatting to apply. The order is, generally speaking: External CSS Internal CSS <-- what this is In-line CSS Such that if the internal CSS differs from the external CSS, the browser will display the page as the internal CSS commands; likewise, if the in-line CSS differs from the internal CSS or the external CSS, then the browser will format the page as the internal CSS commands. On the page: <body> <div> <p> <span> The above is fairly simplified, if you want more details please post back and I will be happy to provide them. __________________ Validate your Markup Validate your CSS Notepad++ Please use [html], [php], and [code] when posting code or markup. I do not help by Private Message or e-mail. If for some reason I have over-looked a reply to a thread that I have previously replied to, then send me a message.

04-05-2009, 08:39 PM	#5 (permalink)
dm01 Moderator: Design Join Date: Oct 2006 Location: Richmond, B.C.; Canada Posts: 1,466 OS: Windows XP [Version 5.1.2600] SP3 \| Ubuntu Jaunty Jackalope \| Windows 7 Ultimate (MSDNAA I <3 you) My System	Re: Centering my website! Ahh, yes. I'm sorry, I misunderstood. The solution is less simple, but still easy. You need a containing <div> for all of your other <div>s. HTML Code: <body> <div id="container" <!--other divs--> </div><!--#container--> </body> The CSS for this div is: Code: #container{ height: 100%; width: 100%; margin: auto; } __________________ Validate your Markup Validate your CSS Notepad++ Please use [html], [php], and [code] when posting code or markup. I do not help by Private Message or e-mail. If for some reason I have over-looked a reply to a thread that I have previously replied to, then send me a message.

04-05-2009, 10:11 PM	#6 (permalink)
maretard Registered User Join Date: Dec 2007 Location: Georgia Posts: 74 OS: Windows XP Home Edition, SP3 My System	Re: Centering my website! Props to dm01. :) Okay, so... why exactly are Chrome, Mozilla, and Internet Explorer all telling me that the OP's original code is already centered? :( __________________ I'm ridin' dirty. Oh baby, I'm yellow and nerdy.

04-05-2009, 11:02 PM	#7 (permalink)
dm01 Moderator: Design Join Date: Oct 2006 Location: Richmond, B.C.; Canada Posts: 1,466 OS: Windows XP [Version 5.1.2600] SP3 \| Ubuntu Jaunty Jackalope \| Windows 7 Ultimate (MSDNAA I <3 you) My System	Re: Centering my website! Quite simply, they are guessing. In this case they happen to guess correctly as to the deveoper's intention, but they don't always. Opera, on the other hand, never guesses. This is the (main) reason why Opera is "incompatible" with some sites (they are too lazy/ignorant to do a good job), and why Opera is considered by many to be the best browser for web design/development (no surprises afterwards). __________________ Validate your Markup Validate your CSS Notepad++ Please use [html], [php], and [code] when posting code or markup. I do not help by Private Message or e-mail. If for some reason I have over-looked a reply to a thread that I have previously replied to, then send me a message.

04-06-2009, 04:12 PM	#10 (permalink)
Alnero Registered User Join Date: May 2008 Location: UK Posts: 40 OS: Windows XP Pro SP3 My System	Re: Centering my website! I tried it again and still nothing. I guess there's no choice but to try and set the margin values manually as you said. Although, I've no idea what percentages to give them and would I have to do that for all the <div>s or just the main <div> (#Layer1)? __________________ Anything's possible.

04-06-2009, 07:51 PM	#11 (permalink)
dm01 Moderator: Design Join Date: Oct 2006 Location: Richmond, B.C.; Canada Posts: 1,466 OS: Windows XP [Version 5.1.2600] SP3 \| Ubuntu Jaunty Jackalope \| Windows 7 Ultimate (MSDNAA I <3 you) My System	Re: Centering my website! You set the left and right margins of div#container only. Editing other margins may cause unexpected and rather . . . interesting effects. Code: margin-left: auto; margin-right: auto; Code: margin-left: 10%; margin-right: 10%; play with the above percent values to come up with something reasonable __________________ Validate your Markup Validate your CSS Notepad++ Please use [html], [php], and [code] when posting code or markup. I do not help by Private Message or e-mail. If for some reason I have over-looked a reply to a thread that I have previously replied to, then send me a message.

04-08-2009, 02:34 AM	#13 (permalink)
Alnero Registered User Join Date: May 2008 Location: UK Posts: 40 OS: Windows XP Pro SP3 My System	Re: Centering my website! I tried centering a <div> in a new page and it worked. So, it can be done but for some reason it's not working on my other pages. I think the reason why is probably because my code is a mess and something is overriding the #container <div>'s commands (align="center"). Still, I think I'm going to give up on trying to center it. It is roughly centered so I'll leave it like that for now. Thanks for all your help. __________________ Anything's possible. Last edited by Alnero; 04-08-2009 at 02:35 AM.

04-08-2009, 02:43 AM	#14 (permalink)
dm01 Moderator: Design Join Date: Oct 2006 Location: Richmond, B.C.; Canada Posts: 1,466 OS: Windows XP [Version 5.1.2600] SP3 \| Ubuntu Jaunty Jackalope \| Windows 7 Ultimate (MSDNAA I <3 you) My System	Re: Centering my website! Delete one of the sets of margins, they are conflicting with each other and causing a mess. Either Code: margin-left: auto; margin-right: auto; or Code: margin-left: 50%; margin-right: 50%; should be deleted. __________________ Validate your Markup Validate your CSS Notepad++ Please use [html], [php], and [code] when posting code or markup. I do not help by Private Message or e-mail. If for some reason I have over-looked a reply to a thread that I have previously replied to, then send me a message.

04-08-2009, 02:18 PM	#15 (permalink)
Alnero Registered User Join Date: May 2008 Location: UK Posts: 40 OS: Windows XP Pro SP3 My System	Re: Centering my website! I tried that and neither worked, but honestly it's ok. I think I'm going to leave as it is because, I haven't much time to complete it.Thanks for all your help so far. __________________ Anything's possible.