HTML Spacing problem in 2007 outlook express. Kindly any body help

Discussion in 'HTML & Website Design' started by bsreddy_bundi, Oct 18, 2007.

  1. #1
    The following HTML code is displaying in Mozilla, IE7 browsers perfectly what i wanted, but when i send mail this page in outlook express 2007, spacing between header and content area, between content area and footer the space white line is showing 2px gap but actually i kept 1px spacer image in between them.

    ---------------------------------------------------------
    <!-- HTML code for my page //-->


    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
    <html>
    <head>
    <style type="text/css">
    body
    {
    margin:0;
    }
    </style>
    <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
    <title>buzz my goat</title>
    </head>

    <body>
    <table width="805px" border="0" align="center" cellpadding="0" cellspacing="0">
    <tr>
    <td align="center"><img src="images/video-message-header.jpg" alt="header" width="805" height="131"></td>
    </tr>
    </table>

    <table width="805px" border="0" align="center" cellpadding="0" cellspacing="0">
    <tr><td><img src="images/spacer.gif" alt="spacer" width="1px"></td></tr>
    <tr><td>
    <!-- second content table starts here /-->
    <table width="100%" border="0" cellspacing="0" cellpadding="0">
    <tr>
    <td><img src="images/contentbox_01.gif" width="32" height="312" alt="image1"></td>
    <td width="100%"><table width="98%" border="0" cellspacing="0" cellpadding="0">
    <tr>
    <td><img src="images/boxheader.gif" width="728" height="30"></td>
    </tr>
    <tr>
    <td bgcolor="#000000" ><table width="100%" border="0" cellspacing="0" cellpadding="0">
    <tr>
    <!-- PLAYER box left content table starts here /-->
    <td valign="top"><table border="0" cellspacing="0" cellpadding="0">
    <tr>
    <td><img src="images/youhavebeenbuzzed.gif" alt="create" width="214" height="15"></td>
    </tr>
    <!-- first content text image start /-->
    <tr>
    <td><table width="231" border="0" cellspacing="0" cellpadding="0">
    <tr>
    <td><img src="images/spacer.gif" alt="spacer" height="5px"></td>
    </tr>
    <tr>
    <td height="180px" valign="top" class="footernavlinks"><font style="color:#FFFFFF; font-family:Arial, Helvetica, sans-serif; font-size:12px;"> paste all your text in this td </font></td>
    </tr>



    </table>
    </td>
    </tr>
    <!-- first content text image end /-->
    </table></td>
    <!-- PLAYER box left content table Ends here /-->

    <!--Flash PLAYER box content table Starts here /-->

    <td align="left"><a href="#"><img src="images/videomessage.jpg" alt="Click Me" border="0"></a></td>

    <!--Flash PLAYER box content table Ends here /-->

    <!-- PLAYER box Right content Starts here /-->
    <td valign="top">

    <table width="100%" border="0" cellspacing="0" cellpadding="0">

    <tr>
    <td><img src="images/buzzemessage.gif" alt="mypersonalisar" width="149" height="15"></td>
    </tr>
    <tr><td>
    <table width="100%" border="0" cellspacing="0" cellpadding="0">
    <tr>
    <td valign="top" class="footernavlinks" height="237px"><font style="color:#FFFFFF; font-family:Arial, Helvetica, sans-serif; font-size:12px;">Left side text boxes</font></td>
    </tr>
    </table>
    </td></tr>
    </table></td>
    <!-- PLAYER box Right content Starts here /-->
    </tr>
    </table></td>
    </tr>
    <tr>
    <td><img src="images/boxfooter.gif" width="728" height="30"></td>
    </tr>
    </table>
    <!-- Main PLAYER box content table starts here /-->


    <!-- PLAYER box content table Ends here /--></td>
    <td><img src="images/contentbox_03.gif" width="45" height="312" alt="image3"></td>
    </tr>
    </table>

    <!-- second content table ends here /-->
    </td></tr>

    <tr><td><img src="images/spacer.gif" alt="spacer" width="1px"></td></tr>

    <!-- Footer table Starts here /-->

    <tr><td>

    <table width="100%" border="0" cellspacing="0" cellpadding="0">
    <tr>
    <td><img src="images/videomessage-footer-left.gif" width="6" height="36"></td>
    <td width="100%" align="right"><img src="images/footer.gif" width="793" height="36" border="0" usemap="#Map"></td>
    <td><img src="images/videomessage-footer-right.gif" width="6" height="36"></td>
    </tr>
    </table>

    </td></tr>

    <!-- Footer table Ends here /-->
    <tr><td height="30px" align="left" valign="middle" style="border-bottom:solid 1px #000000" ><font style="color:#cccccc; font-family:Arial, Helvetica, sans-serif; font-size:12px;">©2007 Buzz My Goat</font></td>
    </tr>
    </table>

    <map name="Map">
    <area shape="rect" coords="728,9,783,26" href="#">
    </map></body>
    </html>





    ---------------------------------------------------------


    Kindly give anybody suggestion. I will appreciate.

    Thanks and Regards,
    B.Sudhakar Reddy.
    Graphic and Webdesigner
     
    bsreddy_bundi, Oct 18, 2007 IP