0

我已经尝试了所有可能在网络上可行的解决方案，但无法解决这个问题。

这是一个演示问题的页面：

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">

<html lang="en">
<head>
    <meta http-equiv="content-type" content="text/html; charset=utf-8">
    <title>Title Goes Here</title>
</head>

<body>
    <style>
        .centered_text {
            text-align:center;
        }
        .datagrid table { 
            width: 100%; 
            border-spacing: 0px;
        } 
        .datagrid {
            background: #FFFEE1; 
            border: thick solid #A31B2B;
        }
        .datagrid table td, .datagrid table th { 
            padding: 3px; 
        }
        .datagrid table tbody tr td { 
            border: thick solid #A31B2B;
        }
    </style>

    <div class="centered_text datagrid">
        <table>
            <tbody>
                <tr>
                    <td>1</td>
                    <td>2</td>
                    <td>3</td>
                </tr>
            </tbody>
        </table>
    </div>
</body>

当我在 Chrome 或 IE10 中查看此内容时，看起来我希望它...在 div 边框和表格边框之间没有空格。但是，如果我将 IE 文档模式更改为 IE7，表格周围会出现一个空格。

我们还是要支持IE7。如何让这个空间消失？

4

2 回答 2

1

您也可以使用：

<div class="centered_text datagrid">
            <table cellpadding="0" cellspacing="0">
            </table>
    <div>
于 2013-09-11T20:37:53.597 回答
0

应该：

border-collapse:collapse;
border-spacing:0;
于 2013-09-11T20:32:39.167 回答