html - IE(8,9 和 10)中的表格边框不显示

Question

我有一个表格，我想要在行上有水平边框，这在真实浏览器中工作正常，但在 IE 中它只是不显示，这是我的 CSS 和正在发生的情况的图像。我该如何解决这个问题？

屏幕截图

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;
}