div重叠(分层)问题，向高手请教！

JSP代码：

<div class="showphoto"><div id="jqueryPic">
   <table cellspacing="0" border="0" width="950" height="400" bordercolor="white">
    <tr><td class="introduce">
    <!--edit company introduce-->
    </td>
        <td class="introphoto">
            <!-- show photo here -->
        
          <div id="photo_container"></div>
        
        </td></tr>
   </table>
 </div></div>

 CSS样式：

.showphoto{
    width:960px;height:420px;position:relative;z-index:1;top:50px;left:300px;
    background-color: #ffffff;
border: 2px solid transparent;
-moz-border-radius: 10px;
-webkit-border-radius: 10px;
border-radius: 10px;
/*IE 7 AND 8 DO NOT SUPPORT BORDER RADIUS*/
-moz-box-shadow: 0px 0px 12px #000000;
-webkit-box-shadow: 0px 0px 12px #000000;
box-shadow: 0px 0px 12px #000000;
/*IE 7 AND 8 DO NOT SUPPORT BLUR PROPERTY OF SHADOWS*/
opacity: 0.39;
-ms-filter: progid:DXImageTransform.Microsoft.Alpha(Opacity = 39);
/*-ms-filter must come before filter*/
filter: alpha(opacity = 39);
/*INNER ELEMENTS MUST NOT BREAK THIS ELEMENTS BOUNDARIES*/
/*All filters must be placed together*/
}
#jqueryPic{width:950px;height:400px;position:absolute;margin:10px;}
.introduce{width:330px;background:url(../images/introduce01.png)no-repeat right;
           background-color:gray;border-right:none;color:white;font-size:16px;}
.introphoto{background-color:white;border-left:none;position:relative;z-index:2;}

 其中showphoto的Div有圆角边框，并且是半透明背景，而table的td里面的两个div有背景图和焦点图片。现在的效果是，showphoto的div透明背景覆盖在jqueryPic（table）上面，显得table里面的内容很朦胧。我想让showphoto显示在最底层，可是不管我怎么调z-index属性，依然无动于衷。实在是没有办法了，请各位高手，老师们指教。谢谢你们...

哥们我看了下，你的css里面有
.introduce
{
background-color:gray;
border-right:none;
color:white;
}

color:white; 这个导致字体白
在css .showphoto 中有一段要修改
//原来是
opacity: 0.39;
-ms-filter: progid:DXImageTransform.Microsoft.Alpha(Opacity = 39);
/*-ms-filter must come before filter*/
filter: alpha(opacity = 39);

//改为
opacity: 1;
-ms-filter: progid:DXImageTransform.Microsoft.Alpha(Opacity = 100);
/*-ms-filter must come before filter*/
filter: alpha(opacity = 100);
}

.showphoto{
width:960px;height:420px;position:relative;z-index:-1;top:50px;left:300px;
background-color: #ffffff;
border: 2px solid transparent;
-moz-border-radius: 10px;
-webkit-border-radius: 10px;
border-radius: 10px;
/*IE 7 AND 8 DO NOT SUPPORT BORDER RADIUS*/
-moz-box-shadow: 0px 0px 12px #000000;
-webkit-box-shadow: 0px 0px 12px #000000;
box-shadow: 0px 0px 12px #000000;
/*IE 7 AND 8 DO NOT SUPPORT BLUR PROPERTY OF SHADOWS*/
opacity: 0.39;
-ms-filter: progid:DXImageTransform.Microsoft.Alpha(Opacity = 39);
/*-ms-filter must come before filter*/
filter: alpha(opacity = 39);
/*INNER ELEMENTS MUST NOT BREAK THIS ELEMENTS BOUNDARIES*/
/*All filters must be placed together*/
}
#jqueryPic{width:950px;height:400px;position:absolute;margin:10px;
opacity: 1;
-ms-filter: progid:DXImageTransform.Microsoft.Alpha(Opacity = 100);
/*-ms-filter must come before filter*/
filter: alpha(opacity = 100);
}
.introduce{width:330px;background:url(../images/introduce01.png)no-repeat right;
background-color:gray;border-right:none;font-size:16px;}
.introphoto{background-color:white;border-left:none;position:relative;z-index:2;}