Jump to content


Photo

Help: Using <div></div> with css to place template in center of page


  • Please log in to reply
12 replies to this topic

#1 cameeob2003

cameeob2003
  • Members
  • PipPipPip
  • Advanced Member
  • 79 posts

Posted 21 July 2006 - 11:05 AM

I am using the following code and trying to center it in the middle of the page:

<html>
<head>
<title>layout3</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<link rel="stylesheet" type="text/css" href="n2p.css" />
<script type="text/javascript">
<!--
function MM_reloadPage(init) {  //reloads the window if Nav4 resized
  if (init==true) with (navigator) {if ((appName=="Netscape")&&(parseInt(appVersion)==4)) {
    document.MM_pgW=innerWidth; document.MM_pgH=innerHeight; onresize=MM_reloadPage; }}
  else if (innerWidth!=document.MM_pgW || innerHeight!=document.MM_pgH) location.reload();
}
MM_reloadPage(true);
//-->
</script>
</head>
<body bgcolor="#FFFFFF" leftmargin="0" topmargin="0" marginwidth="0" marginheight="0" >
<!-- ImageReady Slices (layout3.psd) -->
<div id="container" align="center" >
		<div style="position:absolute; top: 0px;left: 893px;">
			<img src="images/layout3_01.jpg" width="7" height="700" border="0" alt=""></div>
		<div style="position:absolute; top: 0px; left: 7px;">
			<img src="images/layout3_02.jpg" width="886" height="11" border="0" alt=""></div>	
		<div style="position:absolute; top: 0px; left: 0px;">
			<img src="images/layout3_03.jpg" width="7" height="700" border="0" alt=""></div>
		<div style="position:absolute; top: ; left: ;top: 50px; left: 10px;">
			<img src="images/spacer.gif" width="1" height="11" alt=""></div>
		<div style="position:absolute; top: 11px; left: 7px;">
			<img src="images/layout3_04.jpg" width="701" height="164" alt=""></div>
		<div style="position:absolute; top: 11px; left: 708px;">
			<img src="images/layout3_05.jpg" width="185" height="14" alt=""></div>
		<div style="position:absolute; top: 24px; left: 708px;">
			<img src="images/layout3_06.jpg" width="68" height="18" alt=""></div>
		<div style="position:absolute; top: 50px; left: 776px;">
			<img src="images/layout3_07.jpg" width="103" height="18" alt=""></div>
		<div style="position:absolute; left: 879px; top: 50px;">
			<img src="images/layout3_08.jpg" width="14" height="18" alt=""></div>
		<div style="position:absolute; top: 42px; left: 708px;">
			<img src="images/layout3_09.jpg" width="185" height="8" alt="">	</div>
		<div style="position:absolute; top: 50px; left: 708px;">
			<img src="images/layout3_10.jpg" width="68" height="18" alt=""></div>
		<div style="position:absolute; top: 24px; left: 776px;">
			<img src="images/layout3_11.jpg" width="103" height="18" alt=""></div>
		<div style="position:absolute; top: 24px; left: 879px;">
			<img src="images/layout3_12.jpg" width="14" height="18" alt=""></div>
		<div style="position:absolute; top: 68px; left: 708px;">
			<img src="images/layout3_13.jpg" width="185" height="34" alt=""></div>
		<div style="position:absolute; top: 102px; left: 708px;">
			<img src="images/layout3_14.jpg" width="82" height="17" alt=""></div>
		<div style="position:absolute; top: 102px; left: 790px;">
			<img src="images/layout3_15.jpg" width="23" height="17" alt=""></div>
		<div style="position:absolute; top: 102px; left: 813px;">
			<img src="images/layout3_16.jpg" width="80" height="17" alt=""></div>
		<div style="position:absolute; top: 119px; left: 708px;">
			<img src="images/layout3_17.jpg" width="185" height="56" alt=""></div>
		<div style="position:absolute; top: 175px; left: 7px;">
			<img src="images/layout3_18.jpg" width="886" height="23" alt=""></div>
		<div style="position:absolute; top: 198px; left: 7px;">
			<img src="images/layout3_19.jpg" width="212" height="18" alt=""></div>
		<div style="position:absolute; top: 198px; left: 219px;">
			<img src="images/layout3_20.jpg" width="216" height="18" alt=""></div>
		<div style="position:absolute; top: 198px; left: 435px;">
			<img src="images/layout3_21.jpg" width="224" height="18" alt=""></div>
		<div style="position:absolute; top: 198px; left: 659px;">
			<img src="images/layout3_22.jpg" width="234" height="18" alt=""></div>
		<div style="position:absolute; top: 216px; left: 7px;">
			<img src="images/layout3_23.jpg" width="886" height="3" alt=""></div>
		<div style="position:absolute; top: 219px; left: 7px;">
			<img src="images/layout3_24.jpg" width="213" height="6" alt=""></div>
		<div style="position:absolute; top: ; left: ;top: 219px; left: 220px;">
			<img src="images/layout3_25.jpg" width="216" height="90" alt=""></div>
		<div style="position:absolute; top: ; left: ;top: 219px; left: 436px;">
			<img src="images/layout3_26.jpg" width="223" height="90" alt=""></div>
		<div style="position:absolute; top: ; left: ;top: 219px; left: 659px;">
			<img src="images/layout3_27.jpg" width="234" height="2" alt=""></div>
		<div style="position:absolute; top: 219px; left: 659px;">
			<img src="images/layout3_28.jpg" width="8" height="61" alt=""></div>
		<div style="position:absolute;top: 221px; left: 667px;">
			<img src="images/layout3_29.jpg" width="220" height="47" alt=""></div>
		<div style="position:absolute; top: 221px; left: 887px;">
			<img src="images/layout3_30.jpg" width="6" height="47" alt=""></div>
		<div style="position:absolute; left: 7px; top: 278px;">
			<img src="images/layout3_31.jpg" width="15" height="31" alt=""></div>
		<div style="position:absolute; top: 278px; left: 170px;">
			<img src="images/layout3_32.jpg" width="35" height="31" alt=""></div>
		<div style="position:absolute; left: 106px; top: 225px;">
			<img src="images/layout3_33.jpg" width="14" height="31" alt=""></div>
		<div style="position:absolute; top: 278px; left: 120px;">
			<img src="images/layout3_34.jpg" width="35" height="31" alt=""></div>
		<div style="position:absolute; top: 278px; left: 155px;">
			<img src="images/layout3_35.jpg" width="14" height="31" alt=""></div>
		<div style="position:absolute; top: 278px; left: 71px;">
			<img src="images/layout3_36.jpg" width="35" height="31" alt=""></div>
		<div style="position:absolute; left: 155px; top: 225px;">
			<img src="images/layout3_37.jpg" width="15" height="31" alt=""></div>
		<div style="position:absolute; top: 278px; left: 22px;">
			<img src="images/layout3_38.jpg" width="35" height="31" alt=""></div>
		<div style="position:absolute; top: 225px; left: 205px;">
			<img src="images/layout3_39.jpg" width="15" height="31" alt=""></div>
		<div style="position:absolute; top: 256px; left: 7px;">
			<img src="images/layout3_40.jpg" width="213" height="22" alt=""></div>
		<div style="position:absolute; top: 268px; left: 667px;">
			<img src="images/layout3_41.jpg" width="43" height="12" alt=""></div>
		<div style="position:absolute; top: 268px; left: 710px;">
			<img src="images/layout3_42.jpg" width="45" height="12" alt=""></div>
		<div style="position:absolute; top: 268px; left: 755px;">
			<img src="images/layout3_43.jpg" width="138" height="12" alt=""></div>
		<div style="position:absolute; top: 225px; left: 7px;">
			<img src="images/layout3_44.jpg" width="15" height="31" alt=""></div>
		<div style="position:absolute; top: 225px; left: 170px;">
			<img src="images/layout3_45.jpg" width="35" height="31" alt=""></div>
		<div style="position:absolute; left: 57px; top: 225px;">
			<img src="images/layout3_46.jpg" width="14" height="31" alt=""></div>
		<div style="position:absolute; top: 225px; left: 120px;">
			<img src="images/layout3_47.jpg" width="35" height="31" alt=""></div>
		<div style="position:absolute; top: 278px; left: 107px;">
			<img src="images/layout3_49.jpg" width="13" height="31" alt=""></div>
		<div style="position:absolute; top: ; left: ;top: 225px; left: 71px;">
			<img src="images/layout3_50.jpg" width="35" height="31" alt=""></div>
		<div style="position:absolute; top: 278px; left: 57px;">
			<img src="images/layout3_51.jpg" width="15" height="31" alt=""></div>
		<div style="position:absolute; top: 225px; left: 22px;">
			<img src="images/layout3_52.jpg" width="35" height="31" alt=""></div>
		<div style="position:absolute; top: 278px; left: 205px;">
			<img src="images/layout3_53.jpg" width="15" height="31" alt=""></div>
		<div style="position:absolute; top: 280px; left: 659px;">
			<img src="images/layout3_54.jpg" width="234" height="47" alt=""></div>
		<div style="position:absolute; top: 309px; left: 7px;">
			<img src="images/layout3_55.jpg" width="213" height="19" alt=""></div>
		<div style="position:absolute; top: 309px; left: 220px;">
			<img src="images/layout3_56.jpg" width="216" height="19" alt=""></div>
		<div style="position:absolute; top: 309px; left: 436px;">
			<img src="images/layout3_57.jpg" width="223" height="19" alt=""></div>
		<div style="position:absolute; top: 327; left: 659px;">
			<img src="images/layout3_58.jpg" width="234" height="19" alt=""></div>
		<div style="position:absolute; top: ; left: ;top: 328px; left: 7px;">
			<img src="images/layout3_59.jpg" width="652" height="18" alt=""></div>
		<div style="position:absolute; left: 7px;top: 519px;">
			<img src="images/layout3_60.jpg" width="652" height="135" alt=""></div>
		<div style="position:absolute; top: ; left: ;top: 346px; left: 659px;">
			<img src="images/layout3_61.jpg" width="234" height="111" alt=""></div>
		<div style="position:absolute; top: 457px; left: 659px;">
			<img src="images/layout3_62.jpg" width="234" height="19" alt=""></div>	
	<div style="position:absolute; top: ; left: ;top: 476px; left: 659px;"><img src="images/layout3_63.jpg" width="234" height="111" alt=""></div>
		<div style="position:absolute; left: 7px;top: 656px;">
			<img src="images/layout3_64.jpg" width="652" height="19" alt=""></div>
		<div style="position:absolute; top: ; left: 7px; top: 500px;">
			<img src="images/layout3_65.jpg" width="652" height="19" alt=""></div>
		<div style="position:absolute; left: 7px;top: 346px; left: 7px;">
			<img src="images/layout3_66.jpg" width="652" height="137" alt=""></div>
		<div style="position:absolute; top: ; left: ;top: 587px; left: 659px;">
			<img src="images/layout3_67.jpg" width="234" height="19" alt=""></div>
		<div style="position:absolute; top: 606px; left: 659px;">
			<img src="images/layout3_68.jpg" width="234" height="67" alt=""></div>
		<div style="position:absolute; left: 7px;top: 481px;">
			<img src="images/layout3_69.jpg" width="652" height="19" alt=""></div>
		<div style="position:absolute; left: 7px;top: 673px; left: 7px;">
			<img src="images/layout3_70.jpg" width="886" height="27" alt=""></div>
		<!-- End ImageReady Slices -->
</div>
</body>
</html>

All that happens is that the page stays aligned to the left so i used this css file with it to try and align it to the middle:

#container{
margin-left: auto;
margin-right: auto;
/*Margin left and right set to auto center's our layout*/
text-align: left; /*Resets the text alignment*/
}

Any ideas on why it wont align to the middle? All help is welcome!

#2 wildteen88

wildteen88
  • Staff Alumni
  • Advanced Member
  • 10,482 posts
  • LocationUK, Bournemouth

Posted 21 July 2006 - 11:31 AM

In order for your page to align to the middle you will need to use a valid DOCTYPE (which you dont have). And you need to give your container div a width. Otherwiser the browser wont be able to calculate the auto margins to center the page in the browser.

#3 makeshift_theory

makeshift_theory
  • Members
  • PipPipPip
  • Advanced Member
  • 226 posts

Posted 21 July 2006 - 01:21 PM

exactly what ^ he said, that and the best method for centering a layout is the following:

body {
text-align:center
}
#container {
margin: 0 auto;
padding:0px;
}
#centerbox {
text-align:left
}

then in the body part you have

<body>
<div id="container">
<div id="body">
Body text
</div>
</div>


You must declare the text-align: left for each container you use unless you want your text center.
<b>Emacs</b> it's great for the body.
<br><br>
<b>Trust the TechnoLust</b>

<b><u>Have a question check here:</u></b>
PHP Manual: http://www.php.net

#4 wildteen88

wildteen88
  • Staff Alumni
  • Advanced Member
  • 10,482 posts
  • LocationUK, Bournemouth

Posted 21 July 2006 - 02:22 PM

makeshift_theory thats not a good way to go about it at all.

#5 makeshift_theory

makeshift_theory
  • Members
  • PipPipPip
  • Advanced Member
  • 226 posts

Posted 21 July 2006 - 03:25 PM

That's how I do all the css only designs that I've done and it works out fine.  I create a class for the pages that I want to be left aligned and bingo I'm done.  All I'm saying is it works without a flaw and it's cross browser compliant, what more could you want?
<b>Emacs</b> it's great for the body.
<br><br>
<b>Trust the TechnoLust</b>

<b><u>Have a question check here:</u></b>
PHP Manual: http://www.php.net

#6 wildteen88

wildteen88
  • Staff Alumni
  • Advanced Member
  • 10,482 posts
  • LocationUK, Bournemouth

Posted 21 July 2006 - 04:29 PM

What I was getting at was your method, where you align all the bits you want left and what bits your want to be aligned right. You dont hav to do that. You can wrap everthing up in a container div and do this:
#container{
margin-left: auto;
margin-right: auto;
width: 800px;
}
which wont effect how your text/elements align, but only the container div.

#7 makeshift_theory

makeshift_theory
  • Members
  • PipPipPip
  • Advanced Member
  • 226 posts

Posted 21 July 2006 - 05:06 PM

Oic, thanks that clarifies a lot, hmmm I must look into this for the cms I'm working on.  Thanks for the clarification.
<b>Emacs</b> it's great for the body.
<br><br>
<b>Trust the TechnoLust</b>

<b><u>Have a question check here:</u></b>
PHP Manual: http://www.php.net

#8 dbrimlow

dbrimlow
  • Members
  • PipPipPip
  • Advanced Member
  • 712 posts

Posted 21 July 2006 - 05:07 PM

The above is correct, but don't forget to set your body margins to zero.

body {
margin: 0;
}

Also, it will not help you if you put design tags in your body markup (bgcolor="#FFFFFF" leftmargin="0" topmargin="0" marginwidth="0" marginheight="0" ). First of all, it is obsolete, but, it will over-ride any other css command. - remember the cascading rule ... the page will use the last design instruction it sees on the page.

And, you may also have an issue with your use of all those absolute divs.

They will look different in Web standard Browsers vs IE 6.0 and above.
They will blow up totally in IE 5.1x and do strange things in IE 5.5.

And from a design standpoint ... it is common to limit an overall design width to 800px.

Many offices around the world still have 15" CRT monitors (13.5" viewable) set at 800 x 600. So, if you set your design to float, it will acommodate any screen type.


Dave

I am always amazed by no matter how much I know, I know I don't know as much as I thought I knew.  - D. Brimlow.

#9 cameeob2003

cameeob2003
  • Members
  • PipPipPip
  • Advanced Member
  • 79 posts

Posted 21 July 2006 - 10:17 PM

I have tryed the method posted here but im still seeing the same issue it wont align the content to the center. Im new to the css thing so the more detailed an explination the better. I think I understand what was mentioned above but its all still aligned to the left. Could this be due to the (Top: px; Left: px;) commands or am i not wrapping my <div> tags correctly?

Would i have to modify all the <div> tags to have an id from the css sheet or no?

#10 moberemk

moberemk
  • Members
  • PipPipPip
  • Advanced Member
  • 695 posts

Posted 21 July 2006 - 11:54 PM

It would be because of the left: px; command. It would also help greatly to have a valid DOCTYPE.
Disclaimer: No matter how harsh I may be, I'm always IMO only.

#11 cameeob2003

cameeob2003
  • Members
  • PipPipPip
  • Advanced Member
  • 79 posts

Posted 22 July 2006 - 12:43 AM

how would i get it to stay positioned how i want without having the left: px; command ? Is there another command i can use?

#12 wildteen88

wildteen88
  • Staff Alumni
  • Advanced Member
  • 10,482 posts
  • LocationUK, Bournemouth

Posted 22 July 2006 - 11:47 AM

OKay looking at your code provided you are using alot of absolute positoning. I would not advise you to use absolute positoning. This probably why your page is not being centered. Get rid of the positioning.

Also dont use ImageReady's auto generated HTML code either, have a go at coding the layout yourself.

#13 cameeob2003

cameeob2003
  • Members
  • PipPipPip
  • Advanced Member
  • 79 posts

Posted 22 July 2006 - 04:48 PM

Ok after almost a full day of research and coding I have done it!!!! So i wanted to share my setup and what i have learned with everyone else. In all I got alot of good answers but none of them 100% correct (I figure its because this situation can have many outcomes). In any case I will share my html file and css file that worked.

<title>n2p - Nothing to Prove -</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<link rel="stylesheet" type="text/css" href="n2p.css" />
</head>
<body>
<div id="container">
<div id="body">
		<div id="divleftmargin893px" style="position:absolute;top: 0px;">
			<img src="images/layout3_01.jpg" width="7" height="700" border="0" alt=""></div>
		<div id="divleftmargin7px" style="position:absolute;top: 0px;">
			<img src="images/layout3_02.jpg" width="886" height="11" border="0" alt=""></div>	
		<div id="divleftmargin0px" style="position:absolute; top: 0px;">
			<img src="images/layout3_03.jpg" width="7" height="700" border="0" alt=""></div>
		<div id="divleftmargin7px" style="position:absolute;top: 11px;">
			<img src="images/layout3_04.jpg" width="701" height="164" alt=""></div>
		<div id="divleftmargin708px" style="position:absolute;top: 11px;">
			<img src="images/layout3_05.jpg" width="185" height="14" alt=""></div>
		<div id="divleftmargin708px" style="position:absolute;top: 24px;">
			<img src="images/layout3_06.jpg" width="68" height="18" alt=""></div>
		<div id="divleftmargin776px" style="position:absolute;top: 50px;">
			<img src="images/layout3_07.jpg" width="103" height="18" alt=""></div>
		<div id="divleftmargin879px" style="position:absolute; top: 50px;">
			<img src="images/layout3_08.jpg" width="14" height="18" alt=""></div>
		<div id="divleftmargin708px" style="position:absolute;top: 42px;">
			<img src="images/layout3_09.jpg" width="185" height="8" alt=""></div>
		<div id="divleftmargin708px" style="position:absolute;top: 50px;">
			<img src="images/layout3_10.jpg" width="68" height="18" alt=""></div>
		<div id="divleftmargin776px" style="position:absolute;top: 24px;">
			<img src="images/layout3_11.jpg" width="103" height="18" alt=""></div>
		<div id="divleftmargin879px" style="position:absolute;top: 24px;">
			<img src="images/layout3_12.jpg" width="14" height="18" alt=""></div>
		<div id="divleftmargin708px" style="position:absolute; top: 68px;">
			<img src="images/layout3_13.jpg" width="185" height="34" alt=""></div>
		<div id="divleftmargin708px" style="position:absolute; top: 102px;">
			<img src="images/layout3_14.jpg" width="82" height="17" alt=""></div>
		<div id="divleftmargin790px" style="position:absolute; top: 102px;">
			<img src="images/layout3_15.jpg" width="23" height="17" alt=""></div>
		<div id="divleftmargin813px" style="position:absolute; top: 102px;">
			<img src="images/layout3_16.jpg" width="80" height="17" alt=""></div>
		<div id="divleftmargin708px" style="position:absolute; top: 119px;">
			<img src="images/layout3_17.jpg" width="185" height="56" alt=""></div>
		<div id="divleftmargin7px" style="position:absolute; top: 175px;">
			<img src="images/layout3_18.jpg" width="886" height="23" alt=""></div>
		<div id="divleftmargin7px" style="position:absolute; top: 198px;">
			<img src="images/layout3_19.jpg" width="212" height="18" alt=""></div>
		<div id="divleftmargin219px" style="position:absolute; top: 198px;">
			<img src="images/layout3_20.jpg" width="216" height="18" alt=""></div>
		<div id="divleftmargin435px" style="position:absolute; top: 198px;">
			<img src="images/layout3_21.jpg" width="224" height="18" alt=""></div>
		<div id="divleftmargin659px" style="position:absolute; top: 198px;">
			<img src="images/layout3_22.jpg" width="234" height="18" alt=""></div>
		<div id="divleftmargin7px" style="position:absolute; top: 216px;">
			<img src="images/layout3_23.jpg" width="886" height="3" alt=""></div>
		<div id="divleftmargin7px" style="position:absolute; top: 219px;">
			<img src="images/layout3_24.jpg" width="213" height="6" alt=""></div>
		<div id="divleftmargin220px" style="position:absolute; top: 219px;">
			<img src="images/layout3_25.jpg" width="216" height="90" alt=""></div>
		<div id="divleftmargin436px" style="position:absolute; top: 219px;">
			<img src="images/layout3_26.jpg" width="223" height="90" alt=""></div>
		<div id="divleftmargin659px" style="position:absolute; top: 219px;">
			<img src="images/layout3_27.jpg" width="234" height="2" alt=""></div>
		<div id="divleftmargin659px" style="position:absolute; top: 219px;">
			<img src="images/layout3_28.jpg" width="8" height="61" alt=""></div>
		<div id="divleftmargin676px" style="position:absolute;top: 221px;">
			<img src="images/layout3_29.jpg" width="220" height="47" alt=""></div>
		<div id="divleftmargin887px" style="position:absolute; top: 221px;">
			<img src="images/layout3_30.jpg" width="6" height="47" alt=""></div>
		<div id="divleftmargin7px" style="position:absolute; top: 278px;">
			<img src="images/layout3_31.jpg" width="15" height="31" alt=""></div>
		<div id="divleftmargin170px" style="position:absolute; top: 278px;">
			<img src="images/layout3_32.jpg" width="35" height="31" alt=""></div>
		<div id="divleftmargin57px" style="position:absolute; top: 277px;">
			<img src="images/layout3_33.jpg" width="15" height="31" alt=""></div>
		<div id="divleftmargin120px" style="position:absolute; top: 278px;">
			<img src="images/layout3_34.jpg" width="35" height="31" alt=""></div>
		<div id="divleftmargin106px" style="position:absolute; top: 225px;">
			<img src="images/layout3_35.jpg" width="15" height="31" alt=""></div>
		<div id="divleftmargin71px" style="position:absolute; top: 278px;">
			<img src="images/layout3_36.jpg" width="35" height="31" alt=""></div>
		<div id="divleftmargin163px" style="position:absolute; top: 225px;">
			<img src="images/layout3_37.jpg" width="15" height="31" alt=""></div>
		<div id="divleftmargin22px" style="position:absolute; top: 278px;">
			<img src="images/layout3_38.jpg" width="35" height="31" alt=""></div>
		<div id="divleftmargin205px" style="position:absolute; top: 225px;">
			<img src="images/layout3_39.jpg" width="15" height="31" alt=""></div>
		<div id="divleftmargin7px" style="position:absolute; top: 256px;">
			<img src="images/layout3_40.jpg" width="213" height="22" alt=""></div>
		<div id="divleftmargin676px" style="position:absolute; top: 268px;">
			<img src="images/layout3_41.jpg" width="43" height="12" alt=""></div>
		<div id="divleftmargin710px" style="position:absolute; top: 268px;">
			<img src="images/layout3_42.jpg" width="45" height="12" alt=""></div>
		<div id="divleftmargin755px" style="position:absolute; top: 268px;">
			<img src="images/layout3_43.jpg" width="138" height="12" alt=""></div>
		<div id="divleftmargin7px" style="position:absolute; top: 225px;">
			<img src="images/layout3_44.jpg" width="15" height="31" alt=""></div>
		<div id="divleftmargin170px" style="position:absolute; top: 225px;">
			<img src="images/layout3_45.jpg" width="35" height="31" alt=""></div>
		<div id="divleftmargin57px" style="position:absolute; top: 225px;">
			<img src="images/layout3_46.jpg" width="15" height="31" alt=""></div>
		<div id="divleftmargin120px" style="position:absolute; top: 225px;">
			<img src="images/layout3_47.jpg" width="35" height="31" alt=""></div>
		<div id="divleftmargin107px" style="position:absolute; top: 278px;">
			<img src="images/layout3_49.jpg" width="13" height="31" alt=""></div>
		<div id="divleftmargin71px" style="position:absolute; top: 225px;">
			<img src="images/layout3_50.jpg" width="35" height="31" alt=""></div>
		<div id="divleftmargin163px" style="position:absolute; top: 278px;">
			<img src="images/layout3_51.jpg" width="15" height="31" alt=""></div>
		<div id="divleftmargin22px" style="position:absolute; top: 225px;">
			<img src="images/layout3_52.jpg" width="35" height="31" alt=""></div>
		<div id="divleftmargin205px" style="position:absolute; top: 278px;">
			<img src="images/layout3_53.jpg" width="15" height="31" alt=""></div>
		<div id="divleftmargin659px" style="position:absolute; top: 280px;">
			<img src="images/layout3_54.jpg" width="234" height="47" alt=""></div>
		<div id="divleftmargin7px" style="position:absolute; top: 309px;">
			<img src="images/layout3_55.jpg" width="213" height="19" alt=""></div>
		<div id="divleftmargin220px" style="position:absolute; top: 309px;">
			<img src="images/layout3_56.jpg" width="216" height="19" alt=""></div>
		<div id="divleftmargin436px" style="position:absolute; top: 309px;">
			<img src="images/layout3_57.jpg" width="223" height="19" alt=""></div>
		<div id="divleftmargin659px" style="position:absolute; top: 327px;">
			<img src="images/layout3_58.jpg" width="234" height="19" alt=""></div>
		<div id="divleftmargin7px" style="position:absolute; top: 328px;">
			<img src="images/layout3_59.jpg" width="652" height="18" alt=""></div>
		<div id="divleftmargin7px" style="position:absolute; top: 519px;">
			<img src="images/layout3_60.jpg" width="652" height="135" alt=""></div>
		<div id="divleftmargin659px" style="position:absolute; top: 346px;">
			<img src="images/layout3_61.jpg" width="234" height="111" alt=""></div>
		<div id="divleftmargin659px" style="position:absolute; top: 457px;">
			<img src="images/layout3_62.jpg" width="234" height="19" alt=""></div>	
	<div id="divleftmargin659px" style="position:absolute; top: 476px;">
			<img src="images/layout3_63.jpg" width="234" height="111" alt=""></div>
		<div id="divleftmargin7px" style="position:absolute; top: 656px;">
			<img src="images/layout3_64.jpg" width="652" height="19" alt=""></div>
		<div id="divleftmargin7px" style="position:absolute; top: 500px;">
			<img src="images/layout3_65.jpg" width="652" height="19" alt=""></div>
		<div id="divleftmargin7px" style="position:absolute; top: 346px;">
			<img src="images/layout3_66.jpg" width="652" height="137" alt=""></div>
		<div id="divleftmargin659px" style="position:absolute; top: 587px;">
			<img src="images/layout3_67.jpg" width="234" height="19" alt=""></div>
		<div id="divleftmargin659px" style="position:absolute; top: 606px;">
			<img src="images/layout3_68.jpg" width="234" height="67" alt=""></div>
		<div id="divleftmargin7px" style="position:absolute; top: 481px;">
			<img src="images/layout3_69.jpg" width="652" height="19" alt=""></div>
		<div id="divleftmargin7px" style="position:absolute; top: 673px;">
			<img src="images/layout3_70.jpg" width="886" height="27" alt=""></div>
</div></div>
</body>
</html>

css file:

#container {
background-color:#394F66;
margin: 0;
padding:0px;
width: 100%
}
#body{
background-color:#394F66;
text-align:center;
width: 900px;
margin-left: auto;
margin-right: auto;
}
#centerbox {
text-align:left
}
#divleftmargin7px{
margin-left: 7px;
}
#divleftmargin22px{
margin-left: 22px;
}
#divleftmargin71px{
margin-left: 71px;
}
#divleftmargin57px{
margin-left: 57px;
}
#divleftmargin107px{
margin-left: 107px;
}
#divleftmargin120px{
margin-left: 120px;
}
#divleftmargin163px{
margin-left: 155px;
}
#divleftmargin170px{
margin-left: 170px;
}
#divleftmargin205px{
margin-left: 205px;
}
#divleftmargin219px{
margin-left: 219px;
}
#divleftmargin220px{
margin-left: 220px;
}
#divleftmargin435px{
margin-left: 435px;
}
#divleftmargin659px{
margin-left: 659px;
}
#divleftmargin436px{
margin-left: 436px;
}
#divleftmargin755px{
margin-left: 755px;
}
#divleftmargin710px{
margin-left: 710px;
}
#divleftmargin676px{
margin-left: 666px;
}
#divleftmargin0px{
margin-left: 0px;
}
#divleftmargin893px{
margin-left: 893px;
}
#divleftmargin887px{
margin-left: 887px;
}
#divleftmargin708px{
margin-left: 708px;
}
#divleftmargin813px{
margin-left: 813px;
}
#divleftmargin790px{
margin-left: 790px;
}
#divleftmargin879px{
margin-left: 879px;
}
#divleftmargin776px{
margin-left: 776px;
}
#divleftmargin106px{
margin-left: 106px;
}





0 user(s) are reading this topic

0 members, 0 guests, 0 anonymous users