在IE8下table的th上使用filter的话，会把head中的border全部遮盖住,请问怎么解决？

Question

在 IE8 下 我们发现 在table的th上使用filter的话，会把head中的border全部遮盖住，请问大家有没有解决的方法？急~~~~~
下面是示例代码：

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


<
html
>

<
head
>

<
style
>

 th {}{
  -ms-filter:"progid:DXImageTransform.Microsoft.gradient(enabled='true',startColorstr=white, endColorstr=gray)";
  border:10px solid red;
 }  
</
style
>

</
head
>


<
body
>


<
table
>

<
tr
>

<
th
>
Give me a border</
th
>

</
tr
>

<
tr
>

<
th
>
Give me a border</
th
>

</
tr
>

<
tr
>

<
th
>
Give me a border</
th
>

</
tr
>

<
tr
>

<
th
>
Give me a border</
th
>

</
tr
>

</
table
>


</
body
>

</
html
>

Answer 1

在 IE8 下 我们发现 在table的th上使用filter的话，会把head中的border全部遮盖住，请问大家有没有解决的方法？急~~~~~
下面是示例代码：

<!

DOCTYPE

 HTML

 PUBLIC

 "-//W3C//DTD HTML 4.01//EN"

 "http://www.w3.org/TR/html4/strict.dtd"

>



<

html

>


<

head

>


<

style

>


 th {}{
  -ms-filter:"progid:DXImageTransform.Microsoft.gradient(enabled='true',startColorstr=white, endColorstr=gray)";
  border:10px solid red;
 }  
</

style

>


</

head

>



<

body

>



<

table

>


<

tr

>


<

th

>

Give me a border</

th

>


</

tr

>


<

tr

>


<

th

>

Give me a border</

th

>


</

tr

>


<

tr

>


<

th

>

Give me a border</

th

>


</

tr

>


<

tr

>


<

th

>

Give me a border</

th

>


</

tr

>


</

table

>



</

body

>


</

html

>

---

A

Answer 2

在 IE8 下 我们发现 在table的th上使用filter的话，会把head中的border全部遮盖住，请问大家有没有解决的方法？急~~~~~
下面是示例代码：

<!


DOCTYPE


 HTML


 PUBLIC


 "-//W3C//DTD HTML 4.01//EN"


 "http://www.w3.org/TR/html4/strict.dtd"


>




<


html


>



<


head


>



<


style


>



 th {}{
  -ms-filter:"progid:DXImageTransform.Microsoft.gradient(enabled='true',startColorstr=white, endColorstr=gray)";
  border:10px solid red;
 }  
</


style


>



</


head


>




<


body


>




<


table


>



<


tr


>



<


th


>


Give me a border</


th


>



</


tr


>



<


tr


>



<


th


>


Give me a border</


th


>



</


tr


>



<


tr


>



<


th


>


Give me a border</


th


>



</


tr


>



<


tr


>



<


th


>


Give me a border</


th


>



</


tr


>



</


table


>




</


body


>



</


html


>

---

A

---

A

Answer 3

两个方法是1用图片替代效果
2用绝对定位 然后调整定位 布局 即可