Usamos cookies para medir audiência e melhorar sua experiência. Você pode aceitar ou recusar a qualquer momento. Veja sobre o iMasters.
Estou desenvolvendo um formulario aparentemente simples mas que no navegador ie esta me dando dor de cabeça e nao estou conseguindo resolver.
Caso alguem saiba o antidoto ou o nome da hack pra eu buscar no google fico grato.
Visual pretendido:
/applications/core/interface/imageproxy/imageproxy.php?img=http://www.cmax.com.br/erro/chrome.jpg&key=4712feb5eb41bf7364d326645200ca64f1200af43267319b24a402af8227f6df" alt="chrome.jpg" />
(esta funcionando corretamente no Opera, Firefox e Chrome.)
Visual com erro:
/applications/core/interface/imageproxy/imageproxy.php?img=http://cmax.com.br/erro/ie.jpg&key=38e0303966f02ac90171da3415a4bf30e28880678088c5f86164a873759b88cd" alt="ie.jpg" />
(Este erro so ocorre no ie.)
Agradeço atenção de todos.
já tentou um display: inline-block ? nos labels ali dos campos ?
tipo.. mesmo vendo as imagens, é bacana que você explique qual é o problema.
Segue o codigo:
<!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>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta http-equiv="Pragma" content="no-cache">
<meta http-equiv="Expires" content="0">
<meta http-equiv="Cache-Control" content="no-cache">
<link href="/css/painel1a.css" rel="stylesheet" type="text/css" />
<link href="/css/menu_interno.css" rel="stylesheet" type="text/css" />
<link href="/css/jquery-ui.css" rel="stylesheet" type="text/css" /><!--[if IE]>
<script src="/RGRAPH/excanvas/excanvas.original.js"></script>
<![endif]-->
<script src="/js/jquery.min.js" ></script>
<script type="text/javascript" src="/js/jquery-ui.js"></script>
<script type="text/javascript" src="/js/jquery.accordion.js"></script>
<script type="text/javascript" src="/js/jquery.corner.js"></script>
<title>Documento sem título</title>
<style></style>
</head>
<body><!-- RECORTAR E COLAR NO HTML -->
<form name="" action="" method="">
<table width="521" height="594" border="0" cellspacing="0" cellpadding="0">
<tr>
<td colspan="2">ESTRUTURA OPERACIONAL:</td>
</tr>
<tr>
<td height="34" colspan="2"> </td>
</tr>
<tr>
<td height="29px" colspan="2" style="margin-top:0px; border-bottom: 2px solid #9CF;" align="left">
<div id="tabela" style="width:auto; background-image:url(images/centro.jpg); background-repeat:repeat-x; float:left;">
<div id="esq" style="width:25px; height:29px; background-image:url(images/esq.jpg); background-repeat:no-repeat; margin-left:0; float:left;"></div>
<div id="centro" style="width:auto; float:left; padding:3px;">Nivél</div>
<div id="dir" style="width:25px; height:29px; background-image:url(images/dir.jpg); background-repeat:no-repeat; float:right;"></div>
</div></td>
</tr>
<tr>
<td> <select name="jumpMenu" id="jumpMenu" class="select">
<option>LOJAS</option>
<option>Loja 1 - Centro</option>
<option>Loja 2 - Centro</option>
</select></td>
<td> <select name="jumpMenu" id="jumpMenu" class="select">
<option> MATRIZ</option>
<option> MATRIZ 1 - Centro</option>
<option> MATRIZ 2 - Centro</option>
</select> Analitico:
<input type="checkbox" name="checkbox" id="checkbox" />
<label for="checkbox"></label></td>
</tr>
<tr>
<td colspan="2"> </td>
</tr>
<tr>
<td height="29" colspan="2" style="background-image:url(images/bk_form.png); background-repeat:no-repeat; margin-top:0px; border-bottom: 2px solid #9CF;">
<div id="tabela" style="width:auto; background-image:url(images/centro.jpg); background-repeat:repeat-x; float:left;">
<div id="esq" style="width:25px; height:29px; background-image:url(images/esq.jpg); background-repeat:no-repeat; margin-left:0; float:left;"></div>
<div id="centro" style="width:auto; float:left; padding:3px;">Período</div>
<div id="dir" style="width:25px; height:29px; background-image:url(images/dir.jpg); background-repeat:no-repeat; float:right;"></div>
</div></td>
</tr>
<tr>
<td width="229"> Inicio:<input name="" type="text" size="20" /></td>
<td width="280"> Fim:<input name="" type="text" size="20" /></td>
</tr>
<tr>
<td colspan="2"> </td>
</tr>
<tr>
<td height="29" colspan="2" style="margin-top:0px; border-bottom: 2px solid #9CF;">
<div id="tabela" style="width:auto; background-image:url(images/centro.jpg); background-repeat:repeat-x; float:left;">
<div id="esq" style="width:25px; height:29px; background-image:url(images/esq.jpg); background-repeat:no-repeat; margin-left:0; float:left;"></div>
<div id="centro" style="width:auto; float:left; padding:3px;">Data Fixa</div>
<div id="dir" style="width:25px; height:29px; background-image:url(images/dir.jpg); background-repeat:no-repeat; float:right;"></div>
</div> </td>
</tr>
<tr>
<td> Inicio:<select name="DataInicial" id="DataInicial" class="select">
<option>Data inicial</option>
<option>00/00/0000</option>
<option>00/00/0000</option>
</select></td>
<td> Fim: <select name="DataFinal" id="DataFinal" class="select">
<option>Data inicial</option>
<option>00/00/0000</option>
<option>00/00/0000</option>
</select></td>
</tr>
<tr>
<td colspan="2"> </td>
</tr>
<tr>
<td height="29" colspan="2" style="margin-top:0px; border-bottom: 2px solid #9CF;">
<div id="tabela" style="width:auto; background-image:url(images/centro.jpg); background-repeat:repeat-x; float:left;">
<div id="esq" style="width:25px; height:29px; background-image:url(images/esq.jpg); background-repeat:no-repeat; margin-left:0; float:left;"></div>
<div id="centro" style="width:auto; float:left; padding:3px;">Tipo de indicador</div>
<div id="dir" style="width:25px; height:29px; background-image:url(images/dir.jpg); background-repeat:no-repeat; float:right;"></div>
</div> </td>
</tr>
<tr>
<td> <select name="jumpMenu" id="jumpMenu" class="select">
<option>LOJAS</option>
<option>Loja 1 - Centro</option>
<option>Loja 2 - Centro</option>
</select></td>
<td> <select name="jumpMenu" id="jumpMenu" class="select">
<option> MATRIZ</option>
<option> MATRIZ 1 - Centro</option>
<option> MATRIZ 2 - Centro</option>
</select></td>
</tr>
<tr>
<td colspan="2"> </td>
</tr>
<tr>
<td height="29" colspan="2" style="border-bottom: 2px solid #9CF;">
<div id="tabela" style="width:auto; background-image:url(images/centro.jpg); background-repeat:repeat-x; float:left;">
<div id="esq" style="width:25px; height:29px; background-image:url(images/esq.jpg); background-repeat:no-repeat; margin-left:0; float:left;"></div>
<div id="centro" style="width:auto; float:left; padding:3px;">Eixo</div>
<div id="dir" style="width:25px; height:29px; background-image:url(images/dir.jpg); background-repeat:no-repeat; float:right;"></div>
</div> </td>
</tr>
<tr>
<td> <select name="EIXOX" id="EIXOX">
<option> Mes Ano</option>
<option> Setores</option>
<option> Processos</option>
</select>
</td>
<td>Mostrar Meta:<input name="" type="radio" value="" /> Comparar Metas:<input name="" type="radio" value="" /></td>
</tr>
<tr>
<td colspan="2"> </td>
</tr>
<tr>
<td style="border-bottom: 2px solid #9CF;"><div id="tabela" style="width:auto; background-image:url(images/centro.jpg); background-repeat:repeat-x; float:left;">
<div id="esq" style="width:25px; height:29px; background-image:url(images/esq.jpg); background-repeat:no-repeat; margin-left:0; float:left;"></div>
<div id="centro" style="width:auto; float:left; padding:3px;">Tipo Gráfico</div>
<div id="dir" style="width:25px; height:29px; background-image:url(images/dir.jpg); background-repeat:no-repeat; float:right;"></div>
</div></td>
<td style="border-bottom: 2px solid #9CF;">
<div id="tabela" style="width:auto; background-image:url(images/centro.jpg); background-repeat:repeat-x; float:left;">
<div id="esq" style="width:25px; height:29px; background-image:url(images/esq.jpg); background-repeat:no-repeat; margin-left:0; float:left;"></div>
<div id="centro" style="width:auto; float:left; padding:4px;">Tamanho do Gráfico</div>
<div id="dir" style="width:25px; height:29px; background-image:url(images/dir.jpg); background-repeat:no-repeat; float:right;"></div>
</div> </td>
</tr>
<tr>
<td> <select name="jumpMenu" id="jumpMenu">
<option>Colunas</option>
<option> Graficos</option>
<option> velocimetros</option>
</select>
</td>
<td> <select name="jumpMenu" id="jumpMenu">
<option>Grafico Pequeno</option>
<option>Grafico Médio</option>
<option>Grafico Grande</option>
</select>
</td>
</tr>
<tr>
<td colspan="2"> </td>
</tr>
<tr>
<td colspan="2" align="center">
<input type="image" src="images/btn_ggraficos.png" alt="Submit button">
<!--input name="GERAR GRAFICO" type="button" value="GERAR GRAFICO" /-->
</td>
</tr>
</table>
</form><!-- fIM DO RECORTE -->
</body>
</html>O problema esta na imagem background que coloquei nos titulos, (Imagem az.)
Aaaai... meus olhos... tabelas, tabelas e mais tabelas... Divs dentro de células de tabela... Ohh, meu Deeeeus, nãaaaaaaaao!
Hehe, brincadeiras à parte, cara, você já ouviu falar sobre Tableless? Se não dê uma pesquisada.
Se já ouviu falar, sabe o que é ou depois de pesquisar, dê uma olhada aqui:
http://henriquebarcelos.in/blog/2011/12/03/construindo-um-formulario-semantico-em-html/
Meu amigo muito obrigado, agradeço ter me apresentado esse tutorial.
Sinceramente eu desconhecia as regras css para criação de formularios.
Vou literalmente comer esse tutorial em seguida apresnto o resultado.
Att
Fim do Post!!!
>
Aaaai... meus olhos... tabelas, tabelas e mais tabelas... Divs dentro de células de tabela... Ohh, meu Deeeeus, nãaaaaaaaao!
Hehe, brincadeiras à parte, cara, você já ouviu falar sobre Tableless? Se não dê uma pesquisada.
Se já ouviu falar, sabe o que é ou depois de pesquisar, dê uma olhada aqui:
http://henriquebarcelos.in/blog/2011/12/03/construindo-um-formulario-semantico-em-html/
Biano, poste o que você já fez pro pessoal tentar ajudar.