Problema de sobreposição de div
Ola,
Estou com um problema com as divs de uma tela de cadastro em meu sistema, onde é exibido um grid com os dados cadastrados e logo acima um div que permite avançar e recuar paginas do resultado. Acontece que a div pager está sobrepondo a div dados. já tentei mudar o z-index 1 para todas as divs mas a div pager sempre sobrepõe a div dados. Seguem os códigos para análise.
Página:
<?php
session_start();
$id_clinica = $_SESSION['id_clinica'];
include(".././bd/conexao.php");
?><!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<script type="text/javascript" src="../jquery/jquery-1.3.2.js"></script>
<script type="text/javascript" src="../plugins/jquery-tablesorter/jquery.tablesorter.min.js"></script>
<script type="text/javascript" src="../plugins/jquery-tablesorter/jquery.tablesorter.pager.js"></script>
<link rel="stylesheet" href="../css/tabelas.css" />
<link rel="stylesheet" href="../css/tabs.css" />
<link rel="stylesheet" href="../css/estilo.css" />
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Documento sem título</title>
</head>
<body>
<br /><br />
<table class="topo">
<tr>
<td>
<a href="cadastros/cadastrar_medicamento.php">
<img src="../img/novo.png" /><br />Novo
</a>
</td>
</tr>
</table>
<br /><!-- Aba de pesquisa de medicamentos---------------------------------------------------------------------------------------- -->
<div id="pesquisar">
<form method="post" class="pesquisa" action="exemplo.html" id="frm-filtro">
<p>
<label for="pesquisar">Pesquisar</label>
<input type="text" id="pesquisar" name="pesquisar" size="30" />
</p>
</form>
</div>
<br />
<div id="pager" class="pager">
<form>
<span style="font-family: Helvetica,Arial,sans-serif; margin: 0px; padding: 0px;font-size: 12px;">
Exibir <select class="pagesize">
<option selected="selected" value="10">10</option>
<option value="20">20</option>
<option value="30">30</option>
<option value="40">40</option>
</select> registros
</span>
<img src="../img/first.png" class="first"/>
<img src="../img/prev.png" class="prev"/>
<input type="text" class="pagedisplay"/>
<img src="../img/next.png" class="next"/>
<img src="../img/last.png" class="last"/>
</form>
</div>
<br />
<div id="dados">
<table class="pesquisa">
<thead>
<tr>
<th>Código</th>
<th>Medicamento</th>
<th>Genérico</th>
</tr>
</thead>
<tbody>
<?php//-----------------Retorna medicamentos do banco-------
$pesquisa_medicamento = mysql_query("Select * from medicamentos where id_clinica = '$id_clinica'");
$total_medicamentos = mysql_num_rows($pesquisa_medicamento);
for($i=0;$i<$total_medicamentos;$i++){
?>
<tr>
<td><?php echo mysql_result($pesquisa_medicamento,$i,'id_medicamento');?></td>
<td><?php echo mysql_result($pesquisa_medicamento,$i,'nome_medicamento');?></td>
<td><?php echo mysql_result($pesquisa_medicamento,$i,'generico_medicamento');?></td>
<td><a href="./visualizacoes/visualizar_medicamento.php?id_medicamento=<?php echo mysql_result($pesquisa_medicamento,$i,'id_medicamento');?>"><img src="../img/visualizar.png" /><br />Visualizar</a></td>
<td>
<a href="./exclusoes/exclui_medicamento.php?id_medicamento=<?php echo mysql_result($pesquisa_medicamento,$i,'id_medicamento');?>" onclick="return confirm('Tem certeza que deseja remover este registro?');"><img src="../img/remover.png"/><br />Remover</a>
</td>
</tr>
<?php
}
?>
</tbody>
</table>
</div>
<br />
<script>
$(function(){
$('table > tbody > tr:odd').addClass('odd');
$('table > tbody > tr').hover(function(){
$(this).toggleClass('hover');
});
$('#marcar-todos').click(function(){
$('table > tbody > tr > td > :checkbox')
.attr('checked', $(this).is(':checked'))
.trigger('change');
});
$('form').submit(function(e){ e.preventDefault(); });
$('#pesquisar').keyup(function(){
var encontrou = false;
var termo = $(this).val().toLowerCase();
$('table > tbody > tr').each(function(){
$(this).find('td').each(function(){
if($(this).text().toLowerCase().indexOf(termo) > -1) encontrou = true;
});
if(!encontrou) $(this).hide();
else $(this).show();
encontrou = false;
});
});
$("table")
.tablesorter({
dateFormat: 'uk',
headers: {
0: {
sorter: false
},
5: {
sorter: false
}
}
})
.tablesorterPager({container: $("#pager")})
.bind('sortEnd', function(){
$('table > tbody > tr').removeClass('odd');
$('table > tbody > tr:odd').addClass('odd');
});
});
</script>
</div>
</body>
</html>CSS:
@charset "utf-8";
/ CSS Document /
a img{
border:none;
}form.pesquisa{
background-color:#f2f2f2;
width:600px;
margin:10px 0 10px 0;
text-align:center;
}form.pesquisa p{
padding:12px;
}form.pesquisa p label{
color:#333;
font-weight:900;
}form.pesquisa input{
padding:6px;
border:1px solid #ccc;
width:300px;
}table.pesquisa{
width:600px;
border:1px solid #ccc;
}table.pesquisa thead th{
background-color:#666;
padding:6px;
color:#333;
text-align:center;
font-size:14px;
}table.pesquisa thead th.header{
cursor:pointer;
}table.pesquisa tbody td{
padding:6px;
text-align:center;
color:#333;
}table.pesquisa tbody tr.odd td{
background-color:#CCC;
}table.pesquisa tbody tr:hover td{
background-color:#999;
}table.pesquisa tbody tr.selected td{
background-color:#a9f5a9!important;
}table.pesquisa a{
font-size:10px;
color:#333;
text-decoration:none;
font-weight:bold;
text-transform:uppercase;
}table.pesquisa a:hover{
color:#333;
text-decoration:none;
font-weight:bold;
text-transform:uppercase;
}table.pesquisa a:visited{
color:#333;
text-decoration:none;
font-weight:bold;
text-transform:uppercase;
}
.pagedisplay{
width:40px;
text-align:center;
border:none;
background-color:#f2f2f2;
font-weight:900;
}#pager span{
font-weight:900;
display:inline-block;
margin:0 0 0 20px;
color:#666;
float:right;
position:inherit;
}#pager form{
text-align:left;
padding:10px;
}table.visualizacao{
border:none;
color:#333;
}table.visualizacao td{
border-collapse:separate;
border-spacing:10px;
padding:10px;
}
#cabecalho{
margin-top:0px;
width:100%;
height:10px;
}table.cabecalho{
border:none;
font-size:10px;
text-transform:uppercase;
color:#333;
font-weight:bold;
}Discussão (1)
Carregando comentários...