漂浮在容器內部陰影處的表格

Question

假設我想將我的表放入具有內部陰影的容器內，以使其看起來像盒子內部深處或類似的東西。

問題是，當我給我的表格單元格背景顏色時，他們似乎浮動而不是容器的影子，使其不可見。

的z-index似乎沒有解決的問題：

http://jsfiddle.net/h9Fdm/

CSS：

.container { 
    box-shadow: inset 0px 0px 5px black; 
    float: left; 
    width: 100%; 
} 
table{ 
    width: 100%; 
    float: left; 
} 
table tr td{ 
    background-color: #ccc   
} 

HTML：

<div class="container"> 
<table> 
    <tr> 
     <td>fdsa</td> 
     <td>fdsafdsa</td> 
    </tr> 
</table> 
</div>​ 

Answer 1

您可以添加填充的容器div

.container { 
    box-shadow: inset 0px 0px 5px black; 
    float: left; 
    width: 100%; 
    padding: 20px; 
}