MMacD MMacD - 1 month ago 10
CSS Question

Unwanted margin

I'm getting a 2px unwanted margin/padding/border, but can't for the life of me see what's causing it. It comes out the same way in both FF47 and O 36.0.2130.80

enter image description here

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html lang="en">
<head>
<style>
HEAD,BODY,TABLE,TBODY,TR,TH,TD,DIV {
padding:0;
margin:0;
border:0;
}
BODY {
background-color:#555577;
color:#CCCCCC;
font-family:"Verdana","Arial","Helvetica";
font-size:9pt;
text-decoration:none;
border:0;
padding:0;
margin:auto ;
}
</style>
</head>
<body>
<table width="400" style="background-color:white;margin:auto;padding:0;border:0">
<tr>
<td>
<table width=200 style="background-color:#780000;color:white;padding;0;border:0;">
<tr>
<td>FOO</td>
</tr>
</table>
</td>
</tr>
</table>
</body>
</html>

Answer

Add

border-spacing: 0px;

To the table.

    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html lang="en">
<head>
   <style>
       HEAD,BODY,TABLE,TBODY,TR,TH,TD,DIV {
            padding:0;
            margin:0;
            border:0;
            border-spacing: 0px;
            }

       BODY    {
            background-color:#555577;
            color:#CCCCCC;
            font-family:"Verdana","Arial","Helvetica";
            font-size:9pt;
            text-decoration:none;
            border:0;
            padding:0;
            margin:auto ;
            }
    </style>
    </head>
    <body>
        <table><tr><td height="50"></td></tr></table>
        <table width="400" style="background-color:white;margin:auto;padding:0;border:0">
            <tr>
                <td>
                    <table width=200 style="background-color:#780000;color:white;padding;0;border:0;">
                        <tr>
                            <td>FOO</td>
                        </tr>
                    </table>
                </td>
           </tr>
       </table>
    </body>
</html>

https://jsfiddle.net/

enter image description here

Comments