Results 1 to 4 of 4
  1. #1
    How to centre a sliced image in Dreamweaver

    Member Since
    Jan 21, 2012
    Posts
    3
    How to centre a sliced image in Dreamweaver
    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 */
    }

  2. #2
    How to centre a sliced image in Dreamweaver
    louishen's Avatar
    Member Since
    Oct 22, 2007
    Location
    London
    Posts
    8,968
    Specs:
    Mac Mini Core i7 2012 | White 2009 MacBook 2 Ghz | 733 Mhz G4 Quicksilver
    #Table_01 {
    margin: 0 auto;
    width:900px;
    height:675px;
    }
    Member of the Month September 2008 & August 2012 | Found advice useful? use the rep system

  3. #3
    How to centre a sliced image in Dreamweaver

    Member Since
    Jan 21, 2012
    Posts
    3
    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

  4. #4
    How to centre a sliced image in Dreamweaver

    Member Since
    Jan 21, 2012
    Posts
    3
    I've worked it out!
    I hadn't generated a table when I saved for the web in Photoshop.

Thread Information

Users Browsing this Thread

There are currently 1 users browsing this thread. (0 members and 1 guests)

Similar Threads

  1. centre a sliced image from photoshop into dreamweaver cs4
    By annagr in forum Web Design and Hosting
    Replies: 9
    Last Post: 12-13-2012, 07:43 PM
  2. Blue box around image links on Dreamweaver?
    By Ketan in forum Web Design and Hosting
    Replies: 1
    Last Post: 03-07-2010, 12:53 PM
  3. dreamweaver image and table help
    By fender1100 in forum Web Design and Hosting
    Replies: 2
    Last Post: 11-29-2008, 01:48 AM
  4. Help! I sliced my MagSafe cord!
    By thebossone in forum Apple Notebooks
    Replies: 5
    Last Post: 09-19-2008, 06:21 PM
  5. sliced grid image forming large image in folder
    By devon in forum OS X - Operating System
    Replies: 1
    Last Post: 10-24-2004, 06:23 PM

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •