Problemas com sobreposição de divs

Assuntos Gerais
#1

é o seguinte… tenho o seguinte codigo


 
  <table align="center" style="border:1px" border-color="green">	
   <tr bgcolor="#C0C0C0">
     <td>&nbsp;&nbsp;&nbsp;</td>
     <td>&nbsp;&nbsp;&nbsp;</td>
     <td><b>Nome<b></td>
     <td><b>SobreNome<b></td>
     <td><b>Apelido</b></td>
     <td><b>Telefone<b></td>
     <td><b>email</b></td>
   </tr>
   <%
     if (items.size() > 0) { %>
   	<% for (int i = 0; i < items.size(); i++) {%>
      <% Contato item = (Contato)items.get(i);
        if (item != null) {%>	
     	<tr boreder="1" bgcolor="#FFFFFF" style="z-index:1">
     	<td style="z-index:1">
     	  <img     />
     	   <div border="1" border-color="gray" id="div<%=item.getId()%>" style="visibility:hidden; z-index:1;" id="detalhes;" 
     	      onmouseout="hideDiv(<%=item.getId()%>)">
			<table style="border:1px; z-index:0">	
   				<tr>
     			  	<td><b>Nome:</b></td><td><%=item.getNome()%></td>
  				</tr>
   				<tr>
     			 	<td><b>Email:</b></td><td><%=item.getEmail()%></td>
   				</tr>
   				<tr>
     				<td><b>Sobrenome:</b></td><td><%=item.getSobrenome()%></td>
   				</tr>
   				<tr>	
     				<td><b>Telefone:</b></td><td><%=item.getTelefone()%></td>
   				</tr>
   				<tr>
     				<td><b>Apelido:</b></td><td><%=item.getApelido()%></td>
   				</tr>
   				<tr>
     				<td><b>Estado:</b></td><td><%=item.getEndereco().getEstado()%></td>
   				</tr>
      			<tr>
     				<td><b>Cidade:</b></td><td><%=item.getEndereco().getCidade()%></td>
   				</tr>
   				<tr>
     				<td><b>Apelido:</b></td><td><%=item.getApelido()%></td>
   				</tr>
   				<tr>
				    <td><b>Comentario:</b></td>
   				</tr>
   				<tr>
   				 <td><textarea value="<%=item.getComentario()%>"></textarea>
   				</tr> 		
 			</table>
     	</div>
     	  
     	</div>
     	</td>
     	<td><img    /></td>
     	<td><img    /></td>
     	<td><%=item.getNome()%></td>
     	<td><b><%=item.getSobrenome()%></b></td>
     	<td><b><%=item.getApelido()%></b></td>
     	<td><b><%=item.getTelefone()%><b></td>
     	<td><b><%=item.getEmail()%></b></td>
     	</tr>
    <%}%> 	
  <%}%>
 <%}%> 
 </table>

tera um div com algumas informações com visibilidade hidden dentro da coluna da tabela porem este div mesmo com o estatus hidden de visibilidade deixa a coluna maior ocupa espaço nela… como faço para o div não ocupar o espaço da coluna?

#2

Em relação a sobreposição das tags div, é importante observar que estas tags possuem o atributo z-index. O z-index é responsável por definir a ordem de sobreposição das camadas. O menor z-index sempre ficará sob o de maior valor. Você pode definir o valor para cada z-index diretamente no código, ou a travéz de folhas de estilo(CSS ).

#3