CSS opaque background IE6 - IE8

Question

i was using a RGBA background, but it was not working in IE6. I found a way to sort this online.

table{
    width: 100%;
    border-radius: 20px;
    border: 2px solid black;
    padding: 10px;
    text-align: center;
    background: #87C4CF;
    background: rgba(135, 196, 207, 0.7);
    background:rgb(135,196,207);
    background: transparent\9;
    background:rgba(135,196,207,0.7);
    filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#b287C4CF,endColorstr=#b287C4CF);
    zoom: 1;
}
table:nth-child(n) {
    filter: none;
}

This works in IE6 but now the table does not display in IE 8. Works fine in every other browser.

Answer 1

Is a translucent background really going to make or break your layout?

1. For IE8, make a translucent 10px x 10px PNG in PhotoShop with the color and transparency you want and set it as the background image, repeating.

2. Give IE6 a solid background color

3. Everything else will support your rgba() background syntax.