Question

我有一张桌子，我希望行上有水平边框，这在真实浏览器中工作正常但在IE中它只是没有显示，这是我的CSS和正在发生的事情的图像。我该如何解决这个问题？

截图

enter image description here

CSS

.defaultTableStyle {
    border-collapse: collapse;
    text-align: left;
    font-size: 12px;
    width: 100%;
}

    .defaultTableStyle th {
        background: #eee;
    }

    .defaultTableStyle th, .defaultTableStyle td {
        border-top: 1px solid #ccc;
        padding: 6px 8px;
        position: relative;
        text-align: left;
        vertical-align: top;
        white-space: nowrap;
    }

HTML

    <table class="defaultTableStyle" id="resultsTable">
        <tr>
            <th></th>
            <th>Date</th>
            <th>Success Rate</th>
            <th>Coverage</th>
            <th>Duration</th>
        </tr>
            <tr style="" data-result-id="3362" data-successrate="100" data-coverage="2" class="resultDataContainer">
                <td><span class=""><i class="icon-ok"></i></span></td>
                <td>27/02/2014 09:16:29</td>
                <td>100%</td>
                <td>2%</td>
                <td>1 sec</td>
            </tr>
            <tr style="" data-result-id="3361" data-successrate="100" data-coverage="2" class="resultDataContainer">
                <td><span class=""><i class="icon-ok"></i></span></td>
                <td>27/02/2014 09:15:28</td>
                <td>100%</td>
                <td>2%</td>
                <td>1 sec</td>
            </tr>

Answer 1

可以使用添加border-bottom和现有的css

.defaultTableStyle th, .defaultTableStyle td {
    border-top: 1px solid #ccc;
    border-bottom: 1px solid #ccc;
    padding: 6px 8px;
    position: relative;
    text-align: left;
    vertical-align: top;
    white-space: nowrap;
}

Answer 2

我建议删除position:relative，部分原因是因为它对单元格没有任何作用，部分来自纯IE-fear（它在定位方面做了奇怪的事情）。

除此之外，尝试Binita的回答。但是，请尝试：

，而不是两个简写声明

border: 1px solid #ccc;
border-width: 1px 0;

Answer 3

所以在这里你将border-bottom:1px solid #ccc;添加到TD jsfiddle.net/HarishBoke/3fRub

Answer 4

对我来说这很有效：

<table cellspacing="0" and cellpadding="0"> ... </table>

来自here。

Answer 5

检查您的IE Zoom是否设置为100％。当我注意到我正在进行80％缩放时，花时间寻找解决方案。只有现在，当我输入这个答案时，我发现上面的评论指出了这个问题。

IE（8,9＆amp; 10）中的表格边框未显示

5 个答案: