使關閉按鈕使用CSS顯示在另一個元素的前面

我有一個table，我想hide和show使用jQuery。我想在右上角添加一個'close'按鈕。使關閉按鈕使用CSS顯示在另一個元素的前面

但關閉按鈕總是出現在桌子後面，所以沒能在可見

如何使關閉按鈕出現在表格請（不高於/於一側）的前面，因此提供給被點擊？

<style> 
table 
{ 
    border: 3px solid #000000; 
    align: center; 
    text-align: center; 
    color:#000000; 
} 

th,td 
{ 
    border-width: 2px; 
    border-color: #000000; 
    border-style: solid; 
} 

#RCLPage 
{ 
    display:block; 
    position:absolute; 
    z-index:100;  
} 

.close_box 
{ 
    background-image:url('../tsTest2/images/close.gif'); 
    background-repeat:no-repeat; 
    background-position:right top; 
    position:relative; 
    z-index:101; 
    //height:10px; 
} 

#CPSTab 
{ 
    padding:10; 
    width:20em; 
} 

</style> 


<div id="RCLPage"> 

    <div class="close_box"></div> 

    <table id="CPSTab"> 
     <thead> 
      <tr> 
       <th colspan="2">The Header</th> 
      </tr> 
     </thead> 
     <tbody> 
      <tr><td>Item1</td><td>2</td></tr> 
      <tr><td>Item2</td><td>5</td></tr> 
      <tr><td>Item3</td><td>3</td></tr> 
     </tbody> 
    </table>  

</div>

來源

2013-10-24 IGGt