Question

I have the following css for thin borders to my tables. It works in Chrone and Firefox, but not in IE8.

table.list
{
    border-width: 0 0 1px 1px;
    border-spacing: 0;
    border-collapse: collapse;
    border-style: solid;
}

.list td, .list th 
{
    margin: 0;
    padding: 4px;
    border-width: 1px 1px 0 0;
    border-style: solid;
}

In IE8, the left and the bottom borders of the table, not all tds, aren’t shown. Why is that?

Answer 1

I zoomed in and took a close look to the table, there are borders at each left and bottom, but they’re white. I explicitly entered the border-color as black and the case is solved. Here’s the css after the edit:

table.list
{
    border-width: 0 0 1px 1px;
    border-spacing: 0;
    border-collapse: collapse;
    border-style: solid;
    border-color: Black;
}

.list td, .list th 
{
    margin: 0;
    padding: 4px;
    border-width: 1px 1px 0 0;
    border-style: solid;
    border-color:Black;
}