Having followed scrupulously tutorials for slicing an image in photoshop to then save for the web and open in dreamweaver it appears impossible to centre the layout of the page. In the tutorials the image is automatically in a one cell table which can then be centred. My sliced image doesn't seem to be in a cell and I can't put it in one either.
I did see another thread about this but I cannot apply the solutions posted.
Below is the code for my page - which as it stands always appears on the left of the screen.
Any help would be appreciated
<html>
<head>
<title>Cathy-Mader</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<!-- Save for Web Styles (Cathy-Mader.psd) -->
<style type="text/css">
<!--
#Table_01 {
positionbsolute;
left:0px;
top:0px;
width:900px;
height:675px;
}
#mikeburdin-01 {
positionbsolute;
left:0px;
top:0px;
width:900px;
height:106px;
}
#mikeburdin-02 {
positionbsolute;
left:0px;
top:106px;
width:72px;
height:569px;
}
#mikeburdin-03 {
positionbsolute;
left:72px;
top:106px;
width:155px;
height:24px;
}
#mikeburdin-04 {
positionbsolute;
left:227px;
top:106px;
width:15px;
height:569px;
}
#mikeburdin-05 {
positionbsolute;
left:242px;
top:106px;
width:421px;
height:569px;
}
#mikeburdin-06 {
positionbsolute;
left:663px;
top:106px;
width:237px;
height:569px;
}
#mikeburdin-07 {
positionbsolute;
left:72px;
top:130px;
width:155px;
height:24px;
}
#mikeburdin-08 {
positionbsolute;
left:72px;
top:154px;
width:155px;
height:24px;
}
#mikeburdin-09 {
positionbsolute;
left:72px;
top:178px;
width:155px;
height:24px;
}
#mikeburdin-10 {
positionbsolute;
left:72px;
top:202px;
width:155px;
height:24px;
}
#mikeburdin-11 {
positionbsolute;
left:72px;
top:226px;
width:155px;
height:24px;
}
#mikeburdin-12 {
positionbsolute;
left:72px;
top:250px;
width:155px;
height:24px;
}
#mikeburdin-13 {
positionbsolute;
left:72px;
top:274px;
width:155px;
height:24px;
}
#mikeburdin-14 {
positionbsolute;
left:72px;
top:298px;
width:155px;
height:24px;
}
#mikeburdin-15 {
positionbsolute;
left:72px;
top:322px;
width:155px;
height:353px;
}
.centrenow {
}
-->
</style>
<!-- End Save for Web Styles -->
</head>
<body class="centrenow" style="background-color:#FFFFFF; margin-top: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px;">
<!-- Save for Web Slices (Cathy-Mader.psd) -->
<div id="Table_01">
<div id="mikeburdin-01">
<img src="images/mikeburdin_01.gif" width="900" height="106" alt="">
</div>
<div id="mikeburdin-02">
<img src="images/mikeburdin_02.gif" width="72" height="569" alt="">
</div>
<div id="mikeburdin-03">
<img src="images/mikeburdin_03.gif" width="155" height="24" alt="">
</div>
<div id="mikeburdin-04">
<img src="images/mikeburdin_04.gif" width="15" height="569" alt="">
</div>
<div id="mikeburdin-05">
<img src="images/mikeburdin_05.gif" width="421" height="569" alt="">
</div>
<div id="mikeburdin-06">
<img src="images/mikeburdin_06.gif" width="237" height="569" alt="">
</div>
<div id="mikeburdin-07">
<img src="images/mikeburdin_07.gif" width="155" height="24" alt="">
</div>
<div id="mikeburdin-08">
<img src="images/mikeburdin_08.gif" width="155" height="24" alt="">
</div>
<div id="mikeburdin-09">
<img src="images/mikeburdin_09.gif" width="155" height="24" alt="">
</div>
<div id="mikeburdin-10">
<img src="images/mikeburdin_10.gif" width="155" height="24" alt="">
</div>
<div id="mikeburdin-11">
<img src="images/mikeburdin_11.gif" width="155" height="24" alt="">
</div>
<div id="mikeburdin-12">
<img src="images/mikeburdin_12.gif" width="155" height="24" alt="">
</div>
<div id="mikeburdin-13">
<img src="images/mikeburdin_13.gif" width="155" height="24" alt="">
</div>
<div id="mikeburdin-14">
<img src="images/mikeburdin_14.jpg" width="155" height="24" alt="">
</div>
<div id="mikeburdin-15">
<img src="images/mikeburdin_15.gif" width="155" height="353" alt="">
</div>
</div>
<!-- End Save for Web Slices -->
</body>
body {
text-align:center; /* for IE */
margin:0 auto; /* for the rest */
}
I did see another thread about this but I cannot apply the solutions posted.
Below is the code for my page - which as it stands always appears on the left of the screen.
Any help would be appreciated
<html>
<head>
<title>Cathy-Mader</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<!-- Save for Web Styles (Cathy-Mader.psd) -->
<style type="text/css">
<!--
#Table_01 {
positionbsolute;
left:0px;
top:0px;
width:900px;
height:675px;
}
#mikeburdin-01 {
positionbsolute;
left:0px;
top:0px;
width:900px;
height:106px;
}
#mikeburdin-02 {
positionbsolute;
left:0px;
top:106px;
width:72px;
height:569px;
}
#mikeburdin-03 {
positionbsolute;
left:72px;
top:106px;
width:155px;
height:24px;
}
#mikeburdin-04 {
positionbsolute;
left:227px;
top:106px;
width:15px;
height:569px;
}
#mikeburdin-05 {
positionbsolute;
left:242px;
top:106px;
width:421px;
height:569px;
}
#mikeburdin-06 {
positionbsolute;
left:663px;
top:106px;
width:237px;
height:569px;
}
#mikeburdin-07 {
positionbsolute;
left:72px;
top:130px;
width:155px;
height:24px;
}
#mikeburdin-08 {
positionbsolute;
left:72px;
top:154px;
width:155px;
height:24px;
}
#mikeburdin-09 {
positionbsolute;
left:72px;
top:178px;
width:155px;
height:24px;
}
#mikeburdin-10 {
positionbsolute;
left:72px;
top:202px;
width:155px;
height:24px;
}
#mikeburdin-11 {
positionbsolute;
left:72px;
top:226px;
width:155px;
height:24px;
}
#mikeburdin-12 {
positionbsolute;
left:72px;
top:250px;
width:155px;
height:24px;
}
#mikeburdin-13 {
positionbsolute;
left:72px;
top:274px;
width:155px;
height:24px;
}
#mikeburdin-14 {
positionbsolute;
left:72px;
top:298px;
width:155px;
height:24px;
}
#mikeburdin-15 {
positionbsolute;
left:72px;
top:322px;
width:155px;
height:353px;
}
.centrenow {
}
-->
</style>
<!-- End Save for Web Styles -->
</head>
<body class="centrenow" style="background-color:#FFFFFF; margin-top: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px;">
<!-- Save for Web Slices (Cathy-Mader.psd) -->
<div id="Table_01">
<div id="mikeburdin-01">
<img src="images/mikeburdin_01.gif" width="900" height="106" alt="">
</div>
<div id="mikeburdin-02">
<img src="images/mikeburdin_02.gif" width="72" height="569" alt="">
</div>
<div id="mikeburdin-03">
<img src="images/mikeburdin_03.gif" width="155" height="24" alt="">
</div>
<div id="mikeburdin-04">
<img src="images/mikeburdin_04.gif" width="15" height="569" alt="">
</div>
<div id="mikeburdin-05">
<img src="images/mikeburdin_05.gif" width="421" height="569" alt="">
</div>
<div id="mikeburdin-06">
<img src="images/mikeburdin_06.gif" width="237" height="569" alt="">
</div>
<div id="mikeburdin-07">
<img src="images/mikeburdin_07.gif" width="155" height="24" alt="">
</div>
<div id="mikeburdin-08">
<img src="images/mikeburdin_08.gif" width="155" height="24" alt="">
</div>
<div id="mikeburdin-09">
<img src="images/mikeburdin_09.gif" width="155" height="24" alt="">
</div>
<div id="mikeburdin-10">
<img src="images/mikeburdin_10.gif" width="155" height="24" alt="">
</div>
<div id="mikeburdin-11">
<img src="images/mikeburdin_11.gif" width="155" height="24" alt="">
</div>
<div id="mikeburdin-12">
<img src="images/mikeburdin_12.gif" width="155" height="24" alt="">
</div>
<div id="mikeburdin-13">
<img src="images/mikeburdin_13.gif" width="155" height="24" alt="">
</div>
<div id="mikeburdin-14">
<img src="images/mikeburdin_14.jpg" width="155" height="24" alt="">
</div>
<div id="mikeburdin-15">
<img src="images/mikeburdin_15.gif" width="155" height="353" alt="">
</div>
</div>
<!-- End Save for Web Slices -->
</body>
body {
text-align:center; /* for IE */
margin:0 auto; /* for the rest */
}