Hello,
I am trying to center my entire page that was output from Photoshop
slices into CSS. I have searched the web and tried everything from
adding a wrapper DIV with the following:
#wrapper { margin-left:auto; margin-right:auto; }
to also adding:
BODY { text-align:center; }
nothing seems to work. i am pasting the RAW photoshop output. any
help would be greatly appreciated!
<!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>
<title>index13</title>
<meta http-equiv="Content-Type" content="text/html;
charset=iso-8859-1" />
<!-- ImageReady Styles (index13.psd) -->
<style type="text/css">
<!--
#Table_01 {
position:absolute;
left:0px;
top:0px;
width:800px;
height:696px;
}
#index13-01_ {
position:absolute;
left:0px;
top:0px;
width:229px;
height:90px;
}
#index13-02_ {
position:absolute;
left:229px;
top:0px;
width:405px;
height:90px;
}
#index13-03_ {
position:absolute;
left:634px;
top:0px;
width:166px;
height:90px;
}
#index13-04_ {
position:absolute;
left:0px;
top:90px;
width:17px;
height:606px;
}
#index13-05_ {
position:absolute;
left:17px;
top:90px;
width:47px;
height:512px;
}
#index13-06_ {
position:absolute;
left:64px;
top:90px;
width:350px;
height:38px;
}
#index13-07_ {
position:absolute;
left:414px;
top:90px;
width:188px;
height:66px;
}
#index13-08_ {
position:absolute;
left:602px;
top:90px;
width:148px;
height:66px;
}
#index13-09_ {
position:absolute;
left:750px;
top:90px;
width:50px;
height:358px;
}
#index13-10_ {
position:absolute;
left:64px;
top:128px;
width:350px;
height:115px;
}
#index13-11_ {
position:absolute;
left:414px;
top:156px;
width:188px;
height:87px;
}
#index13-12_ {
position:absolute;
left:602px;
top:156px;
width:116px;
height:87px;
}
#index13-13_ {
position:absolute;
left:718px;
top:156px;
width:32px;
height:404px;
}
#index13-14_ {
position:absolute;
left:64px;
top:243px;
width:64px;
height:309px;
}
#index13-15_ {
position:absolute;
left:128px;
top:243px;
width:500px;
height:260px;
}
#index13-16_ {
position:absolute;
left:628px;
top:243px;
width:90px;
height:309px;
}
#index13-17_ {
position:absolute;
left:750px;
top:448px;
width:41px;
height:147px;
}
#index13-18_ {
position:absolute;
left:791px;
top:448px;
width:9px;
height:248px;
}
#index13-19_ {
position:absolute;
left:128px;
top:503px;
width:500px;
height:16px;
}
#index13-20_ {
position:absolute;
left:128px;
top:519px;
width:63px;
height:33px;
}
#index13-21_ {
position:absolute;
left:191px;
top:519px;
width:70px;
height:26px;
}
#index13-22_ {
position:absolute;
left:261px;
top:519px;
width:20px;
height:33px;
}
#index13-23_ {
position:absolute;
left:281px;
top:519px;
width:56px;
height:26px;
}
#index13-24_ {
position:absolute;
left:337px;
top:519px;
width:18px;
height:33px;
}
#index13-25_ {
position:absolute;
left:355px;
top:519px;
width:35px;
height:25px;
}
#index13-26_ {
position:absolute;
left:390px;
top:519px;
width:13px;
height:33px;
}
#index13-27_ {
position:absolute;
left:403px;
top:519px;
width:40px;
height:25px;
}
#index13-28_ {
position:absolute;
left:443px;
top:519px;
width:14px;
height:33px;
}
#index13-29_ {
position:absolute;
left:457px;
top:519px;
width:125px;
height:25px;
}
#index13-30_ {
position:absolute;
left:582px;
top:519px;
width:46px;
height:33px;
}
#index13-31_ {
position:absolute;
left:355px;
top:544px;
width:35px;
height:8px;
}
#index13-32_ {
position:absolute;
left:403px;
top:544px;
width:40px;
height:8px;
}
#index13-33_ {
position:absolute;
left:457px;
top:544px;
width:125px;
height:8px;
}
#index13-34_ {
position:absolute;
left:191px;
top:545px;
width:70px;
height:7px;
}
#index13-35_ {
position:absolute;
left:281px;
top:545px;
width:56px;
height:7px;
}
#index13-36_ {
position:absolute;
left:64px;
top:552px;
width:350px;
height:43px;
}
#index13-37_ {
position:absolute;
left:414px;
top:552px;
width:304px;
height:43px;
}
#index13-38_ {
position:absolute;
left:718px;
top:560px;
width:32px;
height:41px;
}
#index13-39_ {
position:absolute;
left:64px;
top:595px;
width:143px;
height:101px;
}
#index13-40_ {
position:absolute;
left:207px;
top:595px;
width:40px;
height:18px;
}
#index13-41_ {
position:absolute;
left:247px;
top:595px;
width:8px;
height:101px;
}
#index13-42_ {
position:absolute;
left:255px;
top:595px;
width:65px;
height:19px;
}
#index13-43_ {
position:absolute;
left:320px;
top:595px;
width:10px;
height:101px;
}
#index13-44_ {
position:absolute;
left:330px;
top:595px;
width:36px;
height:19px;
}
#index13-45_ {
position:absolute;
left:366px;
top:595px;
width:10px;
height:101px;
}
#index13-46_ {
position:absolute;
left:376px;
top:595px;
width:45px;
height:19px;
}
#index13-47_ {
position:absolute;
left:421px;
top:595px;
width:5px;
height:101px;
}
#index13-48_ {
position:absolute;
left:426px;
top:595px;
width:50px;
height:19px;
}
#index13-49_ {
position:absolute;
left:476px;
top:595px;
width:10px;
height:101px;
}
#index13-50_ {
position:absolute;
left:486px;
top:595px;
width:52px;
height:19px;
}
#index13-51_ {
position:absolute;
left:538px;
top:595px;
width:180px;
height:3px;
}
#index13-52_ {
position:absolute;
left:750px;
top:595px;
width:41px;
height:101px;
}
#index13-53_ {
position:absolute;
left:538px;
top:598px;
width:17px;
height:98px;
}
#index13-54_ {
position:absolute;
left:555px;
top:598px;
width:153px;
height:77px;
}
#index13-55_ {
position:absolute;
left:708px;
top:598px;
width:10px;
height:98px;
}
#index13-56_ {
position:absolute;
left:718px;
top:601px;
width:32px;
height:95px;
}
#index13-57_ {
position:absolute;
left:17px;
top:602px;
width:47px;
height:94px;
}
#index13-58_ {
position:absolute;
left:207px;
top:613px;
width:40px;
height:83px;
}
#index13-59_ {
position:absolute;
left:255px;
top:614px;
width:65px;
height:82px;
}
#index13-60_ {
position:absolute;
left:330px;
top:614px;
width:36px;
height:82px;
}
#index13-61_ {
position:absolute;
left:376px;
top:614px;
width:45px;
height:82px;
}
#index13-62_ {
position:absolute;
left:426px;
top:614px;
width:50px;
height:82px;
}
#index13-63_ {
position:absolute;
left:486px;
top:614px;
width:52px;
height:82px;
}
#index13-64_ {
position:absolute;
left:555px;
top:675px;
width:153px;
height:21px;
}
-->
</style>
<!-- End ImageReady Styles -->
</head>
<body style="background-color:#FFFFFF;">
<!-- ImageReady Slices (index13.psd) -->
<div id="Table_01">
<div id="index13-01_">
<img id="index13_01" src="images/index13_01.gif"
width="229"
height="90" alt="" />
</div>
<div id="index13-02_">
<img id="index13_02" src="images/index13_02.jpg"
width="405"
height="90" alt="" />
</div>
<div id="index13-03_">
<img id="index13_03" src="images/index13_03.gif"
width="166"
height="90" alt="" />
</div>
<div id="index13-04_">
<img id="index13_04" src="images/index13_04.gif"
width="17"
height="606" alt="" />
</div>
<div id="index13-05_">
<img id="index13_05" src="images/index13_05.jpg"
width="47"
height="512" alt="" />
</div>
<div id="index13-06_">
<img id="index13_06" src="images/index13_06.jpg"
width="350"
height="38" alt="" />
</div>
<div id="index13-07_">
<img id="index13_07" src="images/index13_07.jpg"
width="188"
height="66" alt="" />
</div>
<div id="index13-08_">
<img id="index13_08" src="images/index13_08.jpg"
width="148"
height="66" alt="" />
</div>
<div id="index13-09_">
<img id="index13_09" src="images/index13_09.gif"
width="50"
height="358" alt="" />
</div>
<div id="index13-10_">
<img id="index13_10" src="images/index13_10.gif"
width="350"
height="115" alt="" />
</div>
<div id="index13-11_">
<img id="index13_11" src="images/index13_11.gif"
width="188"
height="87" alt="" />
</div>
<div id="index13-12_">
<img id="index13_12" src="images/index13_12.jpg"
width="116"
height="87" alt="" />
</div>
<div id="index13-13_">
<img id="index13_13" src="images/index13_13.jpg"
width="32"
height="404" alt="" />
</div>
<div id="index13-14_">
<img id="index13_14" src="images/index13_14.gif"
width="64"
height="309" alt="" />
</div>
<div id="index13-15_">
<img id="index13_15" src="images/index13_15.jpg"
width="500"
height="260" alt="" />
</div>
<div id="index13-16_">
<img id="index13_16" src="images/index13_16.gif"
width="90"
height="309" alt="" />
</div>
<div id="index13-17_">
<img id="index13_17" src="images/index13_17.jpg"
width="41"
height="147" alt="" />
</div>
<div id="index13-18_">
<img id="index13_18" src="images/index13_18.gif"
width="9"
height="248" alt="" />
</div>
<div id="index13-19_">
<img id="index13_19" src="images/index13_19.gif"
width="500"
height="16" alt="" />
</div>
<div id="index13-20_">
<img id="index13_20" src="images/index13_20.gif"
width="63"
height="33" alt="" />
</div>
<div id="index13-21_">
<img id="index13_21" src="images/index13_21.gif"
width="70"
height="26" alt="" />
</div>
<div id="index13-22_">
<img id="index13_22" src="images/index13_22.gif"
width="20"
height="33" alt="" />
</div>
<div id="index13-23_">
<img id="index13_23" src="images/index13_23.gif"
width="56"
height="26" alt="" />
</div>
<div id="index13-24_">
<img id="index13_24" src="images/index13_24.gif"
width="18"
height="33" alt="" />
</div>
<div id="index13-25_">
<img id="index13_25" src="images/index13_25.gif"
width="35"
height="25" alt="" />
</div>
<div id="index13-26_">
<img id="index13_26" src="images/index13_26.gif"
width="13"
height="33" alt="" />
</div>
<div id="index13-27_">
<img id="index13_27" src="images/index13_27.gif"
width="40"
height="25" alt="" />
</div>
<div id="index13-28_">
<img id="index13_28" src="images/index13_28.gif"
width="14"
height="33" alt="" />
</div>
<div id="index13-29_">
<img id="index13_29" src="images/index13_29.gif"
width="125"
height="25" alt="" />
</div>
<div id="index13-30_">
<img id="index13_30" src="images/index13_30.gif"
width="46"
height="33" alt="" />
</div>
<div id="index13-31_">
<img id="index13_31" src="images/index13_31.gif"
width="35"
height="8" alt="" />
</div>
<div id="index13-32_">
<img id="index13_32" src="images/index13_32.gif"
width="40"
height="8" alt="" />
</div>
<div id="index13-33_">
<img id="index13_33" src="images/index13_33.gif"
width="125"
height="8" alt="" />
</div>
<div id="index13-34_">
<img id="index13_34" src="images/index13_34.gif"
width="70"
height="7" alt="" />
</div>
<div id="index13-35_">
<img id="index13_35" src="images/index13_35.gif"
width="56"
height="7" alt="" />
</div>
<div id="index13-36_">
<img id="index13_36" src="images/index13_36.jpg"
width="350"
height="43" alt="" />
</div>
<div id="index13-37_">
<img id="index13_37" src="images/index13_37.jpg"
width="304"
height="43" alt="" />
</div>
<div id="index13-38_">
<img id="index13_38" src="images/index13_38.gif"
width="32"
height="41" alt="" />
</div>
<div id="index13-39_">
<img id="index13_39" src="images/index13_39.gif"
width="143"
height="101" alt="" />
</div>
<div id="index13-40_">
<img id="index13_40" src="images/index13_40.gif"
width="40"
height="18" alt="" />
</div>
<div id="index13-41_">
<img id="index13_41" src="images/index13_41.gif"
width="8"
height="101" alt="" />
</div>
<div id="index13-42_">
<img id="index13_42" src="images/index13_42.gif"
width="65"
height="19" alt="" />
</div>
<div id="index13-43_">
<img id="index13_43" src="images/index13_43.gif"
width="10"
height="101" alt="" />
</div>
<div id="index13-44_">
<img id="index13_44" src="images/index13_44.gif"
width="36"
height="19" alt="" />
</div>
<div id="index13-45_">
<img id="index13_45" src="images/index13_45.gif"
width="10"
height="101" alt="" />
</div>
<div id="index13-46_">
<img id="index13_46" src="images/index13_46.gif"
width="45"
height="19" alt="" />
</div>
<div id="index13-47_">
<img id="index13_47" src="images/index13_47.gif"
width="5"
height="101" alt="" />
</div>
<div id="index13-48_">
<img id="index13_48" src="images/index13_48.gif"
width="50"
height="19" alt="" />
</div>
<div id="index13-49_">
<img id="index13_49" src="images/index13_49.gif"
width="10"
height="101" alt="" />
</div>
<div id="index13-50_">
<img id="index13_50" src="images/index13_50.gif"
width="52"
height="19" alt="" />
</div>
<div id="index13-51_">
<img id="index13_51" src="images/index13_51.gif"
width="180"
height="3" alt="" />
</div>
<div id="index13-52_">
<img id="index13_52" src="images/index13_52.gif"
width="41"
height="101" alt="" />
</div>
<div id="index13-53_">
<img id="index13_53" src="images/index13_53.gif"
width="17"
height="98" alt="" />
</div>
<div id="index13-54_">
<img id="index13_54" src="images/index13_54.jpg"
width="153"
height="77" alt="" />
</div>
<div id="index13-55_">
<img id="index13_55" src="images/index13_55.gif"
width="10"
height="98" alt="" />
</div>
<div id="index13-56_">
<img id="index13_56" src="images/index13_56.gif"
width="32"
height="95" alt="" />
</div>
<div id="index13-57_">
<img id="index13_57" src="images/index13_57.gif"
width="47"
height="94" alt="" />
</div>
<div id="index13-58_">
<img id="index13_58" src="images/index13_58.gif"
width="40"
height="83" alt="" />
</div>
<div id="index13-59_">
<img id="index13_59" src="images/index13_59.gif"
width="65"
height="82" alt="" />
</div>
<div id="index13-60_">
<img id="index13_60" src="images/index13_60.gif"
width="36"
height="82" alt="" />
</div>
<div id="index13-61_">
<img id="index13_61" src="images/index13_61.gif"
width="45"
height="82" alt="" />
</div>
<div id="index13-62_">
<img id="index13_62" src="images/index13_62.gif"
width="50"
height="82" alt="" />
</div>
<div id="index13-63_">
<img id="index13_63" src="images/index13_63.gif"
width="52"
height="82" alt="" />
</div>
<div id="index13-64_">
<img id="index13_64" src="images/index13_64.gif"
width="153"
height="21" alt="" />
</div>
</div>
<!-- End ImageReady Slices -->
</body>
</html>
--~--~---------~--~----~------------~-------~--~----~
--
You received this because you are subscribed to the "Design the Web with CSS"
at Google groups.
To post: [email protected]
To unsubscribe: [email protected]
-~----------~----~----~----~------~----~------~--~---
