box-shadowでFirefoxだと内枠に影が
box-shadowがFirefoxだと内枠にも付いてしまいます（バージョン20）。
内枠には付けたくないのですが、どうすればよろしいでしょうか？
添付画像のようになってしまいます。
IE10だと内枠には付きません。
このような形にしたいです。
コードを下記します。
<table>
<tr><th>ID</th><th>名前</th><th>得点</th></tr>
<tr><td>1</td><td>ほげ男</td><td>100</td></tr>
<tr><td>2</td><td>ほげ子</td><td>11</td></tr>
</table>
<style type="text/css">
table{
border-spacing:0;
font-family:"メイリオ";
}
table th{
padding:8px 0;
border-top:1px solid #aaa;
border-left:1px solid #aaa;
border-bottom:1px solid #aaa;
text-shadow:0 -1px 0 rgba(255,255,255,0.9);
box-shadow:-1px 0 1px rgba(255,255,255,1)inset,0 -1px 1px rgba(255,255,255,0.5)inset;
background:#eee;
background:linear-gradient(#eee,#ddd 50%);
width:134px;
}
table th:first-child{
border-radius:5px 0 0 0;
}
table th:last-child{
border-radius:0 5px 0 0;
border-right:1px solid #aaa;
box-shadow:2px 2px 1px rgba(0,0,0,0.1),0 -1px 1px rgba(255,255,255,0.5)inset,-1px 0 1px rgba(255,255,255,1)inset;
}
table td{
padding:8px 0;
text-align:center;
border-left:1px solid #aaa;
border-bottom:1px solid #aaa;
}
table td:last-child{
border-right:1px solid #aaa;
box-shadow:2px 2px 1px rgba(0,0,0,0.1);
}
table tr{
background:#fff;
}
table tr:last-child td{
box-shadow:2px 2px 1px rgba(0,0,0,0.1);
}
table tr:last-child td:first-child{
border-radius:0 0 0 5px;
}
table tr:last-child td:last-child{
border-radius:0 0 5px 0;
}
</style>
お礼
できました、ありがとうございました。