How to centre a sliced image in Dreamweaver

Joined
Jan 21, 2012
Messages
3
Reaction score
0
Points
1
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 {
position:absolute;
left:0px;
top:0px;
width:900px;
height:675px;
}

#mikeburdin-01 {
position:absolute;
left:0px;
top:0px;
width:900px;
height:106px;
}

#mikeburdin-02 {
position:absolute;
left:0px;
top:106px;
width:72px;
height:569px;
}

#mikeburdin-03 {
position:absolute;
left:72px;
top:106px;
width:155px;
height:24px;
}

#mikeburdin-04 {
position:absolute;
left:227px;
top:106px;
width:15px;
height:569px;
}

#mikeburdin-05 {
position:absolute;
left:242px;
top:106px;
width:421px;
height:569px;
}

#mikeburdin-06 {
position:absolute;
left:663px;
top:106px;
width:237px;
height:569px;
}

#mikeburdin-07 {
position:absolute;
left:72px;
top:130px;
width:155px;
height:24px;
}

#mikeburdin-08 {
position:absolute;
left:72px;
top:154px;
width:155px;
height:24px;
}

#mikeburdin-09 {
position:absolute;
left:72px;
top:178px;
width:155px;
height:24px;
}

#mikeburdin-10 {
position:absolute;
left:72px;
top:202px;
width:155px;
height:24px;
}

#mikeburdin-11 {
position:absolute;
left:72px;
top:226px;
width:155px;
height:24px;
}

#mikeburdin-12 {
position:absolute;
left:72px;
top:250px;
width:155px;
height:24px;
}

#mikeburdin-13 {
position:absolute;
left:72px;
top:274px;
width:155px;
height:24px;
}

#mikeburdin-14 {
position:absolute;
left:72px;
top:298px;
width:155px;
height:24px;
}

#mikeburdin-15 {
position:absolute;
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 */
}
 
Joined
Oct 22, 2007
Messages
8,967
Reaction score
287
Points
83
Location
London
Your Mac's Specs
Mac Mini Core i7 2012 | White 2009 MacBook 2 Ghz | 733 Mhz G4 Quicksilver
#Table_01 {
margin: 0 auto;
width:900px;
height:675px;
}
 
OP
M
Joined
Jan 21, 2012
Messages
3
Reaction score
0
Points
1
Many thanks but substituting this code for
#Table_01 {
position:absolute;
left:0px;
top:0px;
width:900px;
height:675px;
works really well for the top slice but not the others.

I don't really know what I'm doing but I'm a keen learner

Mat
 
OP
M
Joined
Jan 21, 2012
Messages
3
Reaction score
0
Points
1
I've worked it out!
I hadn't generated a table when I saved for the web in Photoshop.
 

Shop Amazon


Shop for your Apple, Mac, iPhone and other computer products on Amazon.
We are a participant in the Amazon Services LLC Associates Program, an affiliate program designed to provide a means for us to earn fees by linking to Amazon and affiliated sites.
Top