Centering a web page with CSS

Question

dougancil 0 Junior Poster in Training

13 Years Ago

I have a web page that I converted from a psd file to html with Photoshop and imported into Dreamweaver. The problem I'm having is that some viewers comment on the fact that the page is left justified. I inserted a div tag into the html with a wrap around selection and tried to modify the css rules so that this would align properly, and the page is still aligning left justified. Here is the code that I have for my css:

#site_layout {
	font-family: "Franklin Gothic Demi Cond";
	background-color: #FFF;
	height: auto;
	width: auto;
	margin-left: auto;
	margin-right: auto;
}

and here is the html for the web site:

<html>
<head>
<title>MSB secondary page template</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<link href="site_layout.css" rel="stylesheet" type="text/css">
</head>
<body bgcolor="#FFFFFF" leftmargin="0" topmargin="0" marginwidth="0" marginheight="0">
<!-- Save for Web Slices (MSB secondary page template.psd) -->
<div id="container">
  <div id="site_layout">
    <div class="css" id="site_layout.css">
      <table width="1260" height="811" border="0" align="center" cellpadding="0" cellspacing="0" id="Table_01">
        <tr>
          <td colspan="26" align="center" bgcolor="#FFFFFF">
            <img src="images/MSB-secondary-page-template_01.gif" width="1259" height="24" alt=""></td>
          <td>
            <img src="images/spacer.gif" width="1" height="24" alt=""></td>
          </tr>
        <tr>
          <td colspan="20" rowspan="2" align="center" bgcolor="#FFFFFF">
            <img src="images/MSB-secondary-page-template_02.gif" width="1036" height="48" alt=""></td>
          <td colspan="2" align="center" bgcolor="#FFFFFF">
            <img src="images/MSB-secondary-page-template_03.jpg" width="60" height="22" alt=""></td>
          <td colspan="4" rowspan="5" align="center" bgcolor="#FFFFFF">
            <img src="images/MSB-secondary-page-template_04.gif" width="163" height="65" alt=""></td>
          <td>
            <img src="images/spacer.gif" width="1" height="22" alt=""></td>
          </tr>
        <tr>
          <td colspan="2" rowspan="4" align="center" bgcolor="#FFFFFF">
            <img src="images/MSB-secondary-page-template_05.gif" width="60" height="43" alt=""></td>
          <td>
            <img src="images/spacer.gif" width="1" height="26" alt=""></td>
          </tr>
        <tr>
          <td colspan="19" align="center" bgcolor="#FFFFFF">
            <img src="images/MSB-secondary-page-template_06.gif" width="873" height="8" alt=""></td>
          <td rowspan="5" align="center" bgcolor="#FFFFFF">
            <img src="images/MSB-secondary-page-template_07.jpg" width="163" height="58" alt=""></td>
          <td>
            <img src="images/spacer.gif" width="1" height="8" alt=""></td>
          </tr>
        <tr>
          <td colspan="3" rowspan="5" align="center" bgcolor="#FFFFFF">
            <img src="images/MSB-secondary-page-template_08.gif" width="166" height="51" alt=""></td>
          <td rowspan="5" align="center" bgcolor="#FFFFFF">
            <img src="images/MSB-secondary-page-template_09.jpg" width="120" height="51" alt=""></td>
          <td rowspan="5" align="center" bgcolor="#FFFFFF">
            <img src="images/MSB-secondary-page-template_10.gif" width="16" height="51" alt=""></td>
          <td rowspan="5" align="center" bgcolor="#FFFFFF">
            <img src="images/MSB-secondary-page-template_11.jpg" width="120" height="51" alt=""></td>
          <td colspan="13" align="center" bgcolor="#FFFFFF">
            <img src="images/MSB-secondary-page-template_12.gif" width="451" height="1" alt=""></td>
          <td>
            <img src="images/spacer.gif" width="1" height="1" alt=""></td>
          </tr>
        <tr>
          <td rowspan="4" align="center" bgcolor="#FFFFFF">
            <img src="images/MSB-secondary-page-template_13.gif" width="19" height="50" alt=""></td>
          <td colspan="2" rowspan="4" align="center" bgcolor="#FFFFFF">
            <img src="images/MSB-secondary-page-template_14.jpg" width="119" height="50" alt=""></td>
          <td colspan="2" rowspan="4" align="center" bgcolor="#FFFFFF">
            <img src="images/MSB-secondary-page-template_15.gif" width="22" height="50" alt=""></td>
          <td colspan="4" rowspan="4" align="center" bgcolor="#FFFFFF">
            <img src="images/MSB-secondary-page-template_16.jpg" width="118" height="50" alt=""></td>
          <td rowspan="4" align="center" bgcolor="#FFFFFF">
            <img src="images/MSB-secondary-page-template_17.gif" width="19" height="50" alt=""></td>
          <td colspan="2" rowspan="4" align="center" bgcolor="#FFFFFF">
            <img src="images/MSB-secondary-page-template_18.jpg" width="118" height="50" alt=""></td>
          <td rowspan="4" align="center" bgcolor="#FFFFFF">
            <img src="images/MSB-secondary-page-template_19.gif" width="36" height="50" alt=""></td>
          <td>
            <img src="images/spacer.gif" width="1" height="8" alt=""></td>
          </tr>
        <tr>
          <td rowspan="3" align="center" bgcolor="#FFFFFF">
            <img src="images/MSB-secondary-page-template_20.gif" width="8" height="42" alt=""></td>
          <td colspan="2" align="center" bgcolor="#FFFFFF">
            <img src="images/MSB-secondary-page-template_21.jpg" width="58" height="24" alt=""></td>
          <td colspan="3" rowspan="3" align="center" bgcolor="#FFFFFF">
            <img src="images/MSB-secondary-page-template_22.gif" width="157" height="42" alt=""></td>
          <td>
            <img src="images/spacer.gif" width="1" height="24" alt=""></td>
          </tr>
        <tr>
          <td colspan="2" rowspan="2" align="center" bgcolor="#FFFFFF">
            <img src="images/MSB-secondary-page-template_23.gif" width="58" height="18" alt=""></td>
          <td>
            <img src="images/spacer.gif" width="1" height="17" alt=""></td>
          </tr>
        <tr>
          <td align="center" bgcolor="#FFFFFF">
            <img src="images/MSB-secondary-page-template_24.gif" width="163" height="1" alt=""></td>
          <td>
            <img src="images/spacer.gif" width="1" height="1" alt=""></td>
          </tr>
        <tr>
          <td rowspan="4" align="center" bgcolor="#FFFFFF">
            <img src="images/MSB-secondary-page-template_25.gif" width="148" height="665" alt=""></td>
          <td colspan="15" align="center" bgcolor="#FFFFFF">
            <img src="images/MSB-secondary-page-template_26.jpg" width="571" height="221" alt=""></td>
          <td colspan="8" align="center" bgcolor="#FFFFFF">
            <img src="images/MSB-secondary-page-template_27.jpg" width="405" height="221" alt=""></td>
          <td colspan="2" rowspan="4" align="center" bgcolor="#FFFFFF">
            <img src="images/MSB-secondary-page-template_28.gif" width="135" height="665" alt=""></td>
          <td>
            <img src="images/spacer.gif" width="1" height="221" alt=""></td>
          </tr>
        <tr>
          <td rowspan="3" align="center" bgcolor="#FFFFFF">
            <img src="images/MSB-secondary-page-template_29.gif" width="1" height="444" alt=""></td>
          <td colspan="22" align="center" bgcolor="#FFFFFF">
            <img src="images/MSB-secondary-page-template_30.gif" width="975" height="402" alt=""></td>
          <td>
            <img src="images/spacer.gif" width="1" height="402" alt=""></td>
          </tr>
        <tr>
          <td colspan="6" rowspan="2" align="center" bgcolor="#FFFFFF">
            <img src="images/MSB-secondary-page-template_31.gif" width="388" height="42" alt=""></td>
          <td colspan="2" align="center" bgcolor="#FFFFFF">
            <img src="images/MSB-secondary-page-template_32.jpg" width="44" height="21" alt=""></td>
          <td colspan="2" rowspan="2" align="center" bgcolor="#FFFFFF">
            <img src="images/MSB-secondary-page-template_33.gif" width="12" height="42" alt=""></td>
          <td align="center" bgcolor="#FFFFFF">
            <img src="images/MSB-secondary-page-template_34.jpg" width="77" height="21" alt=""></td>
          <td rowspan="2" align="center" bgcolor="#FFFFFF">
            <img src="images/MSB-secondary-page-template_35.gif" width="10" height="42" alt=""></td>
          <td colspan="3" align="center" bgcolor="#FFFFFF">
            <img src="images/MSB-secondary-page-template_36.jpg" width="53" height="21" alt=""></td>
          <td colspan="7" rowspan="2" align="center" bgcolor="#FFFFFF">
            <img src="images/MSB-secondary-page-template_37.gif" width="391" height="42" alt=""></td>
          <td>
            <img src="images/spacer.gif" width="1" height="21" alt=""></td>
          </tr>
        <tr>
          <td colspan="2" align="center" bgcolor="#FFFFFF">
            <img src="images/MSB-secondary-page-template_38.gif" width="44" height="21" alt=""></td>
          <td align="center" bgcolor="#FFFFFF">
            <img src="images/MSB-secondary-page-template_39.gif" width="77" height="21" alt=""></td>
          <td colspan="3" align="center" bgcolor="#FFFFFF">
            <img src="images/MSB-secondary-page-template_40.gif" width="53" height="21" alt=""></td>
          <td>
            <img src="images/spacer.gif" width="1" height="21" alt=""></td>
          </tr>
        <tr>
          <td colspan="25" align="center" bgcolor="#FFFFFF">
            <img src="images/MSB-secondary-page-template_41.jpg" width="1250" height="14" alt=""></td>
          <td align="center" bgcolor="#FFFFFF">
            <img src="images/MSB-secondary-page-template_42.gif" width="9" height="14" alt=""></td>
          <td>
            <img src="images/spacer.gif" width="1" height="14" alt=""></td>
          </tr>
        <tr>
          <td>
            <img src="images/spacer.gif" width="148" height="1" alt=""></td>
          <td>
            <img src="images/spacer.gif" width="1" height="1" alt=""></td>
          <td>
            <img src="images/spacer.gif" width="17" height="1" alt=""></td>
          <td>
            <img src="images/spacer.gif" width="120" height="1" alt=""></td>
          <td>
            <img src="images/spacer.gif" width="16" height="1" alt=""></td>
          <td>
            <img src="images/spacer.gif" width="120" height="1" alt=""></td>
          <td>
            <img src="images/spacer.gif" width="19" height="1" alt=""></td>
          <td>
            <img src="images/spacer.gif" width="96" height="1" alt=""></td>
          <td>
            <img src="images/spacer.gif" width="23" height="1" alt=""></td>
          <td>
            <img src="images/spacer.gif" width="21" height="1" alt=""></td>
          <td>
            <img src="images/spacer.gif" width="1" height="1" alt=""></td>
          <td>
            <img src="images/spacer.gif" width="11" height="1" alt=""></td>
          <td>
            <img src="images/spacer.gif" width="77" height="1" alt=""></td>
          <td>
            <img src="images/spacer.gif" width="10" height="1" alt=""></td>
          <td>
            <img src="images/spacer.gif" width="20" height="1" alt=""></td>
          <td>
            <img src="images/spacer.gif" width="19" height="1" alt=""></td>
          <td>
            <img src="images/spacer.gif" width="14" height="1" alt=""></td>
          <td>
            <img src="images/spacer.gif" width="104" height="1" alt=""></td>
          <td>
            <img src="images/spacer.gif" width="36" height="1" alt=""></td>
          <td>
            <img src="images/spacer.gif" width="163" height="1" alt=""></td>
          <td>
            <img src="images/spacer.gif" width="8" height="1" alt=""></td>
          <td>
            <img src="images/spacer.gif" width="52" height="1" alt=""></td>
          <td>
            <img src="images/spacer.gif" width="6" height="1" alt=""></td>
          <td>
            <img src="images/spacer.gif" width="22" height="1" alt=""></td>
          <td>
            <img src="images/spacer.gif" width="126" height="1" alt=""></td>
          <td>
            <img src="images/spacer.gif" width="9" height="1" alt=""></td>
          <td></td>
          </tr>
      </table>
    </div>
  </div>
</div>
<!-- End Save for Web Slices -->
</body>
</html>

Can someone please tell me what I'm doing wrong or not seeing?

Thank you

Doug

web-design

6 Contributors
6 Replies
241 Views
1 Week Discussion Span
Latest Post 13 Years Ago Latest Post by Armadillo

All 6 Replies

lambing 0 Light Poster

13 Years Ago

I can't see comment on your code. it's purely images.. and you are using a table.

Never use a table in your html layout. Use the div tag instead

scottgm 1 Newbie Poster

13 Years Ago

first of all, use divs not tables, they are not practical.

an easy way to center everything is wrap your content in a div called wrap for example then do a little trick with css

in your html

<div id='wrap'>
---- place all your content here ----
</div> <!-- end of #wrap -->

in your css file

#wrap {
width: 960px;
margin: 0 auto;
background: blue;
}

this will set the whole width of the page to 960px, have a blue background and center it.

Arkinder commented: Provided an answer that's not only from this century, but it's also useful. +1

Reply to this topic

Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.

Provided an answer that's not only from this century, but it's also useful.

aniyishay 0 Newbie Poster · Answer 1 · 2010-12-14T09:42:05+00:00

You have to give the #site_container{} a set width, it can't be auto. So width: 980px would be a good one.

Also you should not be using tables this way and image separators, but that would be a lot to explain!

Armadillo 0 Newbie Poster · Answer 2 · 2010-12-16T22:27:56+00:00

It sounds to me like you have some visitors using IE and some using a Mozilla based product. I noticed something missing in your HTML code, so try this litle trick to force IE to correctly render your CSS tags: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">

Place the <DOCTYPE> Tag at the very top of your HTML document.

rajeesh_rsn 0 Posting Whiz in Training · Answer 3 · 2010-12-27T03:55:55+00:00

Hi,

Use <center> tag soon after <body> tag . For eg

<html>
<head> </head>
<body> 
<center>
<-- Content Here
</center>
</body>
<html>

I have a web page that I converted from a psd file to html with Photoshop and imported into Dreamweaver. The problem I'm having is that some viewers comment on the fact that the page is left justified. I inserted a div tag into the html with a wrap around selection and tried to modify the css rules so that this would align properly, and the page is still aligning left justified. Here is the code that I have for my css:

#site_layout {
	font-family: "Franklin Gothic Demi Cond";
	background-color: #FFF;
	height: auto;
	width: auto;
	margin-left: auto;
	margin-right: auto;
}

and here is the html for the web site:

<html>
<head>
<title>MSB secondary page template</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<link href="site_layout.css" rel="stylesheet" type="text/css">
</head>
<body bgcolor="#FFFFFF" leftmargin="0" topmargin="0" marginwidth="0" marginheight="0">
<!-- Save for Web Slices (MSB secondary page template.psd) -->
<div id="container">
  <div id="site_layout">
    <div class="css" id="site_layout.css">
      <table width="1260" height="811" border="0" align="center" cellpadding="0" cellspacing="0" id="Table_01">
        <tr>
          <td colspan="26" align="center" bgcolor="#FFFFFF">
            <img src="images/MSB-secondary-page-template_01.gif" width="1259" height="24" alt=""></td>
          <td>
            <img src="images/spacer.gif" width="1" height="24" alt=""></td>
          </tr>
        <tr>
          <td colspan="20" rowspan="2" align="center" bgcolor="#FFFFFF">
            <img src="images/MSB-secondary-page-template_02.gif" width="1036" height="48" alt=""></td>
          <td colspan="2" align="center" bgcolor="#FFFFFF">
            <img src="images/MSB-secondary-page-template_03.jpg" width="60" height="22" alt=""></td>
          <td colspan="4" rowspan="5" align="center" bgcolor="#FFFFFF">
            <img src="images/MSB-secondary-page-template_04.gif" width="163" height="65" alt=""></td>
          <td>
            <img src="images/spacer.gif" width="1" height="22" alt=""></td>
          </tr>
        <tr>
          <td colspan="2" rowspan="4" align="center" bgcolor="#FFFFFF">
            <img src="images/MSB-secondary-page-template_05.gif" width="60" height="43" alt=""></td>
          <td>
            <img src="images/spacer.gif" width="1" height="26" alt=""></td>
          </tr>
        <tr>
          <td colspan="19" align="center" bgcolor="#FFFFFF">
            <img src="images/MSB-secondary-page-template_06.gif" width="873" height="8" alt=""></td>
          <td rowspan="5" align="center" bgcolor="#FFFFFF">
            <img src="images/MSB-secondary-page-template_07.jpg" width="163" height="58" alt=""></td>
          <td>
            <img src="images/spacer.gif" width="1" height="8" alt=""></td>
          </tr>
        <tr>
          <td colspan="3" rowspan="5" align="center" bgcolor="#FFFFFF">
            <img src="images/MSB-secondary-page-template_08.gif" width="166" height="51" alt=""></td>
          <td rowspan="5" align="center" bgcolor="#FFFFFF">
            <img src="images/MSB-secondary-page-template_09.jpg" width="120" height="51" alt=""></td>
          <td rowspan="5" align="center" bgcolor="#FFFFFF">
            <img src="images/MSB-secondary-page-template_10.gif" width="16" height="51" alt=""></td>
          <td rowspan="5" align="center" bgcolor="#FFFFFF">
            <img src="images/MSB-secondary-page-template_11.jpg" width="120" height="51" alt=""></td>
          <td colspan="13" align="center" bgcolor="#FFFFFF">
            <img src="images/MSB-secondary-page-template_12.gif" width="451" height="1" alt=""></td>
          <td>
            <img src="images/spacer.gif" width="1" height="1" alt=""></td>
          </tr>
        <tr>
          <td rowspan="4" align="center" bgcolor="#FFFFFF">
            <img src="images/MSB-secondary-page-template_13.gif" width="19" height="50" alt=""></td>
          <td colspan="2" rowspan="4" align="center" bgcolor="#FFFFFF">
            <img src="images/MSB-secondary-page-template_14.jpg" width="119" height="50" alt=""></td>
          <td colspan="2" rowspan="4" align="center" bgcolor="#FFFFFF">
            <img src="images/MSB-secondary-page-template_15.gif" width="22" height="50" alt=""></td>
          <td colspan="4" rowspan="4" align="center" bgcolor="#FFFFFF">
            <img src="images/MSB-secondary-page-template_16.jpg" width="118" height="50" alt=""></td>
          <td rowspan="4" align="center" bgcolor="#FFFFFF">
            <img src="images/MSB-secondary-page-template_17.gif" width="19" height="50" alt=""></td>
          <td colspan="2" rowspan="4" align="center" bgcolor="#FFFFFF">
            <img src="images/MSB-secondary-page-template_18.jpg" width="118" height="50" alt=""></td>
          <td rowspan="4" align="center" bgcolor="#FFFFFF">
            <img src="images/MSB-secondary-page-template_19.gif" width="36" height="50" alt=""></td>
          <td>
            <img src="images/spacer.gif" width="1" height="8" alt=""></td>
          </tr>
        <tr>
          <td rowspan="3" align="center" bgcolor="#FFFFFF">
            <img src="images/MSB-secondary-page-template_20.gif" width="8" height="42" alt=""></td>
          <td colspan="2" align="center" bgcolor="#FFFFFF">
            <img src="images/MSB-secondary-page-template_21.jpg" width="58" height="24" alt=""></td>
          <td colspan="3" rowspan="3" align="center" bgcolor="#FFFFFF">
            <img src="images/MSB-secondary-page-template_22.gif" width="157" height="42" alt=""></td>
          <td>
            <img src="images/spacer.gif" width="1" height="24" alt=""></td>
          </tr>
        <tr>
          <td colspan="2" rowspan="2" align="center" bgcolor="#FFFFFF">
            <img src="images/MSB-secondary-page-template_23.gif" width="58" height="18" alt=""></td>
          <td>
            <img src="images/spacer.gif" width="1" height="17" alt=""></td>
          </tr>
        <tr>
          <td align="center" bgcolor="#FFFFFF">
            <img src="images/MSB-secondary-page-template_24.gif" width="163" height="1" alt=""></td>
          <td>
            <img src="images/spacer.gif" width="1" height="1" alt=""></td>
          </tr>
        <tr>
          <td rowspan="4" align="center" bgcolor="#FFFFFF">
            <img src="images/MSB-secondary-page-template_25.gif" width="148" height="665" alt=""></td>
          <td colspan="15" align="center" bgcolor="#FFFFFF">
            <img src="images/MSB-secondary-page-template_26.jpg" width="571" height="221" alt=""></td>
          <td colspan="8" align="center" bgcolor="#FFFFFF">
            <img src="images/MSB-secondary-page-template_27.jpg" width="405" height="221" alt=""></td>
          <td colspan="2" rowspan="4" align="center" bgcolor="#FFFFFF">
            <img src="images/MSB-secondary-page-template_28.gif" width="135" height="665" alt=""></td>
          <td>
            <img src="images/spacer.gif" width="1" height="221" alt=""></td>
          </tr>
        <tr>
          <td rowspan="3" align="center" bgcolor="#FFFFFF">
            <img src="images/MSB-secondary-page-template_29.gif" width="1" height="444" alt=""></td>
          <td colspan="22" align="center" bgcolor="#FFFFFF">
            <img src="images/MSB-secondary-page-template_30.gif" width="975" height="402" alt=""></td>
          <td>
            <img src="images/spacer.gif" width="1" height="402" alt=""></td>
          </tr>
        <tr>
          <td colspan="6" rowspan="2" align="center" bgcolor="#FFFFFF">
            <img src="images/MSB-secondary-page-template_31.gif" width="388" height="42" alt=""></td>
          <td colspan="2" align="center" bgcolor="#FFFFFF">
            <img src="images/MSB-secondary-page-template_32.jpg" width="44" height="21" alt=""></td>
          <td colspan="2" rowspan="2" align="center" bgcolor="#FFFFFF">
            <img src="images/MSB-secondary-page-template_33.gif" width="12" height="42" alt=""></td>
          <td align="center" bgcolor="#FFFFFF">
            <img src="images/MSB-secondary-page-template_34.jpg" width="77" height="21" alt=""></td>
          <td rowspan="2" align="center" bgcolor="#FFFFFF">
            <img src="images/MSB-secondary-page-template_35.gif" width="10" height="42" alt=""></td>
          <td colspan="3" align="center" bgcolor="#FFFFFF">
            <img src="images/MSB-secondary-page-template_36.jpg" width="53" height="21" alt=""></td>
          <td colspan="7" rowspan="2" align="center" bgcolor="#FFFFFF">
            <img src="images/MSB-secondary-page-template_37.gif" width="391" height="42" alt=""></td>
          <td>
            <img src="images/spacer.gif" width="1" height="21" alt=""></td>
          </tr>
        <tr>
          <td colspan="2" align="center" bgcolor="#FFFFFF">
            <img src="images/MSB-secondary-page-template_38.gif" width="44" height="21" alt=""></td>
          <td align="center" bgcolor="#FFFFFF">
            <img src="images/MSB-secondary-page-template_39.gif" width="77" height="21" alt=""></td>
          <td colspan="3" align="center" bgcolor="#FFFFFF">
            <img src="images/MSB-secondary-page-template_40.gif" width="53" height="21" alt=""></td>
          <td>
            <img src="images/spacer.gif" width="1" height="21" alt=""></td>
          </tr>
        <tr>
          <td colspan="25" align="center" bgcolor="#FFFFFF">
            <img src="images/MSB-secondary-page-template_41.jpg" width="1250" height="14" alt=""></td>
          <td align="center" bgcolor="#FFFFFF">
            <img src="images/MSB-secondary-page-template_42.gif" width="9" height="14" alt=""></td>
          <td>
            <img src="images/spacer.gif" width="1" height="14" alt=""></td>
          </tr>
        <tr>
          <td>
            <img src="images/spacer.gif" width="148" height="1" alt=""></td>
          <td>
            <img src="images/spacer.gif" width="1" height="1" alt=""></td>
          <td>
            <img src="images/spacer.gif" width="17" height="1" alt=""></td>
          <td>
            <img src="images/spacer.gif" width="120" height="1" alt=""></td>
          <td>
            <img src="images/spacer.gif" width="16" height="1" alt=""></td>
          <td>
            <img src="images/spacer.gif" width="120" height="1" alt=""></td>
          <td>
            <img src="images/spacer.gif" width="19" height="1" alt=""></td>
          <td>
            <img src="images/spacer.gif" width="96" height="1" alt=""></td>
          <td>
            <img src="images/spacer.gif" width="23" height="1" alt=""></td>
          <td>
            <img src="images/spacer.gif" width="21" height="1" alt=""></td>
          <td>
            <img src="images/spacer.gif" width="1" height="1" alt=""></td>
          <td>
            <img src="images/spacer.gif" width="11" height="1" alt=""></td>
          <td>
            <img src="images/spacer.gif" width="77" height="1" alt=""></td>
          <td>
            <img src="images/spacer.gif" width="10" height="1" alt=""></td>
          <td>
            <img src="images/spacer.gif" width="20" height="1" alt=""></td>
          <td>
            <img src="images/spacer.gif" width="19" height="1" alt=""></td>
          <td>
            <img src="images/spacer.gif" width="14" height="1" alt=""></td>
          <td>
            <img src="images/spacer.gif" width="104" height="1" alt=""></td>
          <td>
            <img src="images/spacer.gif" width="36" height="1" alt=""></td>
          <td>
            <img src="images/spacer.gif" width="163" height="1" alt=""></td>
          <td>
            <img src="images/spacer.gif" width="8" height="1" alt=""></td>
          <td>
            <img src="images/spacer.gif" width="52" height="1" alt=""></td>
          <td>
            <img src="images/spacer.gif" width="6" height="1" alt=""></td>
          <td>
            <img src="images/spacer.gif" width="22" height="1" alt=""></td>
          <td>
            <img src="images/spacer.gif" width="126" height="1" alt=""></td>
          <td>
            <img src="images/spacer.gif" width="9" height="1" alt=""></td>
          <td></td>
          </tr>
      </table>
    </div>
  </div>
</div>
<!-- End Save for Web Slices -->
</body>
</html>

Can someone please tell me what I'm doing wrong or not seeing?

Thank you

Doug

Armadillo 0 Newbie Poster · Answer 4 · 2010-12-27T07:57:55+00:00

The <center> tag is a depreciated tag fro HTML 3.x and may not work well with newer browsers.

Make sure you have the correct and complete DOCTYPE in the first line of your document, then create a CSS declaration for the BODY element of your web page.

Body {
margin-top: 0px;
margin-right: 0px;
margin-left: 0px;
font-family: aerial, times new roman, helvitica;
font-size: 12px;
font-weight: 9;
}
The above will set the body content as follows:
The top, right and left margins will not have a margin of blank space. All body content will have font set at 12 pixels and a bold rendering, and will render nicely in Windows OS ad Mac OS.

Now if you create additional content holders, such as; tables, cells and Divs you can control their positioning with CSS.

<snip>

Centering a web page with CSS

Recommended Answers Collapse Answers

All 6 Replies

Recommended Answers