none
aplicação multibrowser RRS feed

  • Pergunta

  • pessoal, boa tarde..

    tenho um projeto em c#.net que funciona "bem" no IE.. quando abro ele no Chrome ou no FireFox ele fica cheio de bugs no layout.. gostaria de saber se é possível resolver esse problemas, e o que eu deveria fazer para isso..

    quinta-feira, 7 de março de 2013 19:20

Todas as Respostas

  • Existem várias formas de resolver este problema.

    Tem hacks e pessoas que desenvolvem classes de estilo para cada navegador.

    Exemplo de desenvolver uma página de estilo para cada navegador, este exemplo é oq estou usando hj em um projeto

    http://www.ogenial.com.br/blog/css-diferentes-navegador/

    Porém o melhor modo ainda é adaptar da melhor forma possível sua classe para que funcione de forma satisfatória em todos os navegadores.

    Algumas dicas para vc chegar em um resultado satisfatório

    http://www.brunoavila.com.br/avante/css/como-obter-compatibilidade-entre-diferentes-navegadores-web.html


    Paulo Marcelo Dalbosco

    quinta-feira, 7 de março de 2013 19:26
  • eu descobrir aqui por exemplo que tenho uma função javaScript que monta meu menu do lado esquerdo, ele só aparece pra mim no IE, nos outros não aparece.. usando a ferramenta de debug no firefox, e vi que essa função não aparece pra mim no código.. fica um espaço em branco..

    o que poderia está fazendo isso?

    quinta-feira, 7 de março de 2013 19:30
  • É um menu? Ou um Submenu?

    Cole seu código JS aqui.


    Paulo Marcelo Dalbosco

    quinta-feira, 7 de março de 2013 19:57
  • <td class="TD_TabelaAreaCentral_TabelaMenu">
        <table cellpadding="0" cellspacing="0" class="TabelaMenu">
            <tr>
    <td class="TabelaMenuTD"> <div id="Menu"> <script type="text/javascript"> //<![CDATA[   var nTodosSetores = new MenuWin("menu","mm");
    			 nTodosSetores.setTitle("Ocorrências - Todos os Setores");
    			 nTodosSetores.setItens("Pesquisar", "consulta_ocorrencias.aspx?StatusOcor=Aberta", null, "Imagens/Ocorrencia.gif");
    //			 nTodosSetores.setItens("Relatórios", "consulta_ocorrencias.aspx", null, "Imagens/Ocorrencia.gif");
    			 nTodosSetores.draw();
    		         document.write("<br />");
    		                                                        
    		         var nSuporte = new MenuWin("menu","mm2");
    			 nSuporte.setTitle("Suporte");			                                                        
    			 nSuporte.setItens("Ocorrência setor Suporte","cadastro_ocorrencia.aspx?TipoOcorrencia=SetorSuporte",null,"Imagens/Ocorrencia.gif");
    			 nSuporte.draw();
    			 document.write("<br />");	
    			                                                    		                                                        
    			 var nTreinamento = new MenuWin("menu","mm3");
    			 nTreinamento.setTitle("Treinamento / Implantação");			                                                        
    			 nTreinamento.setItens("Pedido de Treinamento","cadastro_ocorrencia.aspx?TipoOcorrencia=PedidoTreinamento",null,"Imagens/Mapas.gif");
    			 nTreinamento.setItens("Outros - Setor Treinamento","cadastro_ocorrencia.aspx?TipoOcorrencia=OutroSetorTreinamento",null,"Imagens/Mapas.gif");
    			 nTreinamento.draw();
    			 document.write("<br />");			                                                    
    			                                                    
    			 var nDesenvolvimento = new MenuWin("menu","mm4");
    nDesenvolvimento.setTitle("Desenvolvimento"); nDesenvolvimento.setItens("Orçamento para Desenvolvimento Específico","cadastro_ocorrencia.aspx?TipoOcorrencia=OrcamentoDesenvolvimento",null,"Imagens/Ocorrencia.gif"); nDesenvolvimento.setItens("Sugestão para o Sistema","cadastro_ocorrencia.aspx?TipoOcorrencia=SugestaoSistema",null,"Imagens/Ocorrencia.gif"); nDesenvolvimento.setItens("Outros - Setor desenvolvimento","cadastro_ocorrencia.aspx?TipoOcorrencia=OutroSetorDesenvolvimento",null,"Imagens/Ocorrencia.gif");
    			 nDesenvolvimento.draw();
    			 document.write("<br />");			                                                        
    			                                                    
    			 var nFinanceiro = new MenuWin("menu","mm5");
    			 nFinanceiro.setTitle("Financeiro");			                                                        
    			 nFinanceiro.setItens("Solicitar 2ª. via do boleto","cadastro_ocorrencia.aspx?TipoOcorrencia=Pedido2ViaBoleto",null,"Imagens/Ocorrencia.gif");
    			 nFinanceiro.setItens("Outros - Setor Financeiro","cadastro_ocorrencia.aspx?TipoOcorrencia=OutroSetorFinanceiro",null,"Imagens/Ocorrencia.gif");
    			 nFinanceiro.draw();
    			 document.write("<br />");
    var nQualidade = new MenuWin("menu","mm6"); nQualidade.setTitle("Qualidade"); nQualidade.setItens("Elogio","cadastro_ocorrencia.aspx?TipoOcorrencia=Elogio",null,"Imagens/Ocorrencia.gif");
    			 nQualidade.setItens("Reclamação","cadastro_ocorrencia.aspx?TipoOcorrencia=Reclamacao",null,"Imagens/Ocorrencia.gif");
    			 nQualidade.setItens("Outros - Setor Qualidade","cadastro_ocorrencia.aspx?TipoOcorrencia=OutroSetorQualiade",null,"Imagens/Ocorrencia.gif");
    			 nQualidade.draw();
    			 document.write("<br />");
    			 var nComercial = new MenuWin("menu", "mm7");
    			 nComercial.setTitle("Comercial");
    			 nComercial.setItens("Comercial", "cadastro_ocorrencia.aspx?TipoOcorrencia=Comercial", null, "Imagens/Ocorrencia.gif");
    			 nComercial.draw();
    			 document.write("<br />");
    
    			 var nMarketing = new MenuWin("menu", "mm8");
    			 nMarketing.setTitle("Marketing");
    			 nMarketing.setItens("Marketing", "cadastro_ocorrencia.aspx?TipoOcorrencia=Marketing", null, "Imagens/Ocorrencia.gif");
    			 nMarketing.draw();
    			 document.write("<br />");
    
    			 var nDiretoria = new MenuWin("menu", "mm9");
    			 nDiretoria.setTitle("Diretoria");
    			 nDiretoria.setItens("Diretoria", "cadastro_ocorrencia.aspx?TipoOcorrencia=Diretoria", null, "Imagens/Ocorrencia.gif");
    			 nDiretoria.draw();
    			 document.write("<br />");
    
    			var nUsuario = new MenuWin("menu", "mm10");
    			nUsuario.setTitle("Administração");
    			nUsuario.setItens("Pesquisar Usuário", "consulta_usuarios.aspx", null, "Imagens/ico_16_8_d.gif");
    			nUsuario.setItens("Cadastrar Usuário", "cadastro_usuario.aspx", null, "Imagens/ico_16_8_d.gif");
    			nUsuario.setItens("Atualizar Cliente", "atualiza_cliente.aspx", null, "Imagens/conta.gif");
    			nUsuario.draw();
    			document.write("<br />");		                                                    

    //]]> </script> &nbsp; </div> </td>

    • Editado kngipa quinta-feira, 7 de março de 2013 20:13
    quinta-feira, 7 de março de 2013 20:11
  • Faz o favor de colocar o CSS da tabela tb

    Paulo Marcelo Dalbosco

    quinta-feira, 7 de março de 2013 20:29
  • ok... estou te mandando a folha de css que tem no projeto.. observei ainda, que nesse caso do menu, existe uma pasta com dois arquivos js e um html.. estou meio perdida assim pq peguei esse projeto pronto...  

    agradeço o seu interesse..

    body
    {
    	background: #CFDEEA;
    	margin: 0px;
    	margin-top:0px; 
    	padding-top:0px;
    	padding: 16px 0;
    	font: 11px Tahoma;
    	color: #282828;
    	font-size: 11px;
    	padding-top:0px;
    	font-size: 11px;
    	
    }
    
    .modalBackground 
    {
    	background-color:Gray;
    	filter:alpha(opacity=70);
    	opacity:0.7;
    }
    
    .modalPopup1 
    {
    	background-color:#FFFFFF;
    	border-width:3px;
    	border-style:solid;
    	border-color:Gray;
    	padding:3px;
    	width:750px;
    }
    
    .modalPopup
    {
        text-align:center;
        padding-top: 30px; 
        border-style:solid; 
        border-width:1px; 
        background-color:White; 
        width:300px; 
        height:60px;
        top: 0px;
    }
    
    .modalPopupCadastroOcorrencia
    {
        text-align:center;
        padding-top: 30px; 
        border-style:solid; 
        border-width:1px; 
        background-color:White; 
        width:230px; 
        height:95px;
        top: -0px;
        left: 0px;
        ;
    }
    
    
    .modalProgressGreyBackground 
    {
        background:#CCCCCC;
    	filter:alpha(opacity=60);
    	opacity:0.6;
    }
    
    .modalProgressRedBackground 
    {
        background:Red;
        filter:alpha(opacity=60);
        opacity:0.6;
    }
    
    .TituloTD
    {
    	text-align: left;
    	font-weight: bold;
    	border-bottom-style: solid;
    	border-bottom-width: thin;
    	color: #000000;
    }
    
    .Pesquisa
    {	
    	text-align: left;
        width: 675px;
    }
    
    .divAtvServicoLeft
    {
    	float: left;
    	width:134px;	
    }
    
    .escondeCol
            {
            	display:none;
            }
    
    .divAtvServicoRight
    {	
    	width:640px;
    }
    
    .divTitul
    {
    	background-color: #000000;
    	color: #FFFFFF;
    	font-weight: bold;
    	width:635px;
    }
    
    .ImagemTextBox
    {
    	width: 18px;
    	font-size: 11px;
    }
    
    .PickListTabela4Colunas
    {
    	width:269px;
    	font-size: 11px;
    }
    
    .PickListRespostas
    {
    	width: 80px;
    	font-family:Tahoma;
    	font-size:11px;
    }
    
    .PickListTabela2Colunas
    {
    	width:660px;
    	font-size: 11px;
    }
    
    /* Define o Tamanho do TextBox para Tabelas com 4 Colunas.
    Propriedades Alteradas:
    	- Tamanho do TextBox */
    .TextBoxTabela4Colunas
    {
    	width:260px;
    	font-size: 11px;
    }
    
    /* Define o Tamanho do TextBox para Tabelas com 4 Colunas com uma Imagem na Frente.
    Propriedades Alteradas:
    	- Tamanho do TextBox */
    .TextBoxTabela4ColunasComImagem
    {
    	width:239px;
    	font-size: 11px;
    }
    
    /* Define o Tamanho do TextBox para Tabelas com 2 Colunas.
    Propriedades Alteradas:
    	- Tamanho do TextBox */
    .TextBoxTabela2ColunasConsulta
    {
    	width:660px;
    	font-size: 11px;
    }
    
    .TextBoxDataHora
    {
    	Width:155px;
    	font-size:11px;
    }
    
    .TextBoxHora
    {
    	Width:50px;
    	font-size:11px;
    }
    
    .TextBoxTabela2ColunasCadastro
    {
    	width:680px;
    	font-size: 11px;
    }
    
    /* Deixa um Componente Invisivel.
    Propriedades Alteradas:
    	- Visibilidade do Componente */
    .EscondeComponente
    {
    	display:none;
    }
    
    .DivLogin
    {
    	height: 486px;
        text-align:center;
    }
    
    /* ####################################### INICIO MASTERPAGE ######################################### */
    
    /* Define a Tabela Geral da MasterPage.
    Propriedades Alteradas:
    	- Largura
    	- Imagem de Fundo
    	- Posicionamento
    	- Tamanho Maximo Permitido
    	- Tamanho Minimo Perminito
    	- Altura */
    .TabelaGeral
    {
    	/*width:100%;	*/
    	background-image: url('../Imagens/mast_back.gif');
    	background-repeat: repeat-x;
    	background- top;	
    	max-width:1024px;
    	min-width:800px;
    	height: 48px;
    	width:970; 
    	/*width:100%;
    	height:100%;*/
    	border:0;
    	font-size: 11px;
    }
    
    /* Define o cabeçalho do Portal - MasterPage
    Propriedades Alteradas:
    	- Altura
    	- Largura
    	- Posição
    	- Imagem de Fundo */
    .Cabecalho
    {
    	height: 56px;
    	width:100%;
    	background-repeat: no-repeat;
    	padding: 0px 15px;
    	background- left;
    	background-image: url('../Imagens/masthead.jpg');
    }
    
    /* Define o Local de Trabalho / Barra de Títulos. Tabela - MasterPage
    Propriedades Alteradas:
    	- Borda	 */
    .LocalTrabalhoTabela
    {	
    	border-top-style:solid; 
    	border-top-width:1px; 
    	border-top-color: #A2BFD7;
    	width:100%;
    	border:0 ;
    }
    
    /* Define o Local de Trabalho / Barra de Títulos. TD - MasterPage
    Propriedades Alteradas:
    	- Borda
    	- Cor de Fundo
    	- Largura */
    .LocalTrabalhoTD
    {	
    	border-right: 1px solid #A2BFD7;
    	background-color: #B2C9EA; 
    	height: 25px;
    	
    }
    
    /* Define o Local de Trabalho / Barra de Títulos. ContentPlaceHolder - MasterPage
    Propriedades Alteradas:
    	- Borda
    	- Cor de Fundo */
    .LocalTrabalhoContentPlaceHolder
    {	
    	border-bottom-style: solid; 
    	border-bottom-width: 1pt; 
    	border-bottom-color: #A2BFD7; 
    	background-color: #B2C9EA;
    }
    
    /* */
    .DivTituloCabecalho
    {
    	; 
    	top:25px; 
    	color:White;
    	font-weight:bold; 
    	width:100%; 
        font-size:16px; 
        font-family:Tahoma; 
        text-align:center;
    }
    
    .DivTituloCabecalhoLogin
    {
    	; 
    	top:8px; 
    	color:White;
    	font-weight:bold; 
    	width:100%; 
        font-size:16px; 
        font-family:Tahoma; 
        text-align:center;
    }
    
    .TituloLogin
    {
    	text-align: center;
    	font-weight: bold;	
    }
    
    /* Define as Propriedades do Div onde ficam o Nome do usuário, Alterar senha e Logoff. MasterPage */
    .DivUsarioLogoff
    {
    	text-align: right; 
    	width: 100%; 
    	margin-left: 6px; 
    	top:11px;
    }
    
    /* Define a Altura da Tabela Central. MasterPage */
    .TabelaAreaCentral
    {
    	border-style: none;
    	border-color: inherit;
    	border-width: 0;
    	height: 100%;
    	width:960px;
    	/*width:98%;*/
    }
    
    /* Define as propriedades da Linha da Tabela Central onde vai ficar o Menu do Portal. MasterPage  */ 
    .TD_TabelaAreaCentral_TabelaMenu
    {
    	width:140; 
    	height:324; 
    	vertical-align:top;
    }
    
    .TabelaMenu
    {
    	vertical-align:top;
    	width:140;	
    	border:0;
    }
    
    .TabelaMenuTD
    {
    	width:140; 
    	height: 23px;
    }
    
    .TD_TabelaAreaCentral_TabelaContentPlaceHolder
    {
    	width:970px;
    	/*width:100%;
    	height:100%;*/
    	
    }
    
    .TabelaAreaCentral_TabelaContentPlaceHolder
    {
    	width:790px; 
    	height: 110px;
    	/*width:100%;
    	height:100%;*/
    }
    
    .Rodape
    {
    	width:100%; 
    	text-align:center;
    	;
    	top:590px;	
    }
    
    
    /* ####################################### FIM MASTERPAGE ######################################### */
    
    
    .TabOcorrencia
    {
    	
    }
    
    .DivGridView
    {
    	overflow:auto;	
    	width:780px;
    	top:0px;
    }
    
    .TabelaCadastro
    {	
    	width:707px;
    	/*height:100%;	*/
    	/*;*/
    	left:190px;
    	top: 120px; 
    	/*height: 366px;*/	
    	font-size: 11px;
    }
    
    .TabelaConsulta
    {
    	width:78%;	
    	left:190px;
    	top: 120px; 
    	/*height: 366px;*/	
    	font-size: 11px;
    }
    
    .TabelaAreaCadastroTDEsquerdo
    {
    	text-align: left;
    }
    
    .TabelaAreaCadastroTDEsquerdo
    {
    	text-align: left;
    	width: 140px;	
    }
    
    .TabelaAreaCadastroTDDireito
    {
    	text-align: left;
    	width: 140px;	
    }
    
    .TabelaAreaListagemTDCampos
    {
    	width: 300px;
    	text-align: left;
    }
    
    .TabelaAreaCadastroTDCampos
    {
    	text-align: left;
    }
    
    .TabelaGridViewListagem
    {
    	width:100%;
    	;
    	left:180px;
    	top:290px;
    }
    
    .TabelaComponentes
    {	
    	width:50px;
    	;
    	left:1177px;
    	top:698px
    }
    
    /* Botão SALVAR. Propriedades Alteradas:
    	- Borda
    	- Nome da Letra
    	- Tamanho da Letra
    	- Curso
    	- Imagem */	
    .BotaoSalvar
    {   
        border: transparent;
        font-family: Tahoma;
        font-size: small;    
        padding: 0 10px 0 20px;
        background: url('../Imagens/save.GIF') no-repeat left center;   
        cursor:pointer;
        width: 18px;
    }   
    
    .BotaoSalvar:hover
    {
        background-color: #CFDEEA;
        border: transparent;
    }
    /*
    da Letra
    	- Tamanho da Letra
    	- Curso
    	- Imagem */
    .BotaoSalvarConcluida
    {   
        border: transparent;
        font-family: Tahoma;
        font-size: small;    
        padding: 0 10px 0 20px;
        background: url('../Imagens/saveCompleted.gif') no-repeat left center;   
        cursor:pointer;
        width: 18px;
    }   
    
    .botaoSalvarConcluida:hover
    {
        background-color: #CFDEEA;
        border: transparent;
    }
    
    .BotaoAgendamento
    {   
        border: transparent;
        font-family: Tahoma;
        font-size: small;    
        padding: 0 10px 0 20px;
        background: url('../Imagens/Agendamento.gif') no-repeat left center;   
        cursor:pointer;
        width: 18px;
    }   
    
    .BotaoAgendamento:hover
    {
        background-color: #CFDEEA;
        border: transparent;
    }
    
    /* Botão ANEXO. Propriedades Alteradas:
    	- Borda
    	- Nome da Letra
    	- Tamanho da Letra
    	- Curso
    	- Imagem */
    	
    .BotaoAnexar
    {   
        border: transparent;
        font-family: Tahoma;
        font-size: small;    
        padding: 0 10px 0 20px;
        background: url('../Imagens/Anexar.gif') no-repeat left center;   
        cursor:pointer;
        width: 18px;
    }   
    .BotaoAnexar:hover
    {
        background-color: #CFDEEA;
        border: transparent;
    }
    
    .BotaoAnexar:hover
    {
        background-color: #CFDEEA;
        border: transparent;
    }
    
    /* Botão ACEITRAR TAREFA. Propriedades Alteradas:
    	- Borda
    	- Nome da Letra
    	- Tamanho da Letra
    	- Curso
    	- Imagem */
    .BotaoAceitarTarefa
    {   
        border: transparent;
        font-family: Tahoma;
        font-size: small;    
        padding: 0 10px 0 20px;
        background: url('../Imagens/Tarefa.gif') no-repeat left center;   
        cursor:pointer;
        width: 18px;
    } 
      
    .BotaoAceitarTarefa:hover
    {
        background-color: #CFDEEA;
        border: transparent;
    }
    
    .BotaoLookup
    {
    	border-style: none;
    	background: url('../Imagens/lookup.GIF') no-repeat left center;
    	width:20px;
    }
    
    /* Botão CONSULTAR. Propriedades Alteradas:
    	- Borda
    	- Nome da Letra
    	- Tamanho da Letra
    	- Curso
    	- Imagem */
    .BotaoConsultar
    {   
        border: transparent;
        font-family: Tahoma;
        font-size: small;    
        padding: 0 10px 0 20px;
        background: url('../Imagens/new.GIF') no-repeat left center;   
        cursor:pointer;
        width: 18px;
    } 
      
    .BotaoConsultar:hover
    {
        background-color: #CFDEEA;
        border: transparent;
    }
    
    /* Botão FECHAR. Propriedades Alteradas:
    	- Borda
    	- Nome da Letra
    	- Tamanho da Letra
    	- Curso
    	- Imagem */
    .BotaoFechar
    {   
        border: transparent;
        font-family: Tahoma;
        font-size: small;    
        padding: 0 10px 0 20px;
        background: url('../Imagens/Fechar.gif') no-repeat left center;   
        cursor:pointer;
        width: 18px;
    }   
    
    .BotaoFechar:hover
    {
        background-color: #CFDEEA;
        border: transparent;
    }
    
    /* Botão IMPRIMIR. Propriedades Alteradas:
    	- Borda
    	- Nome da Letra
    	- Tamanho da Letra
    	- Curso
    	- Imagem */
    .BotaoImprimir
    {   
        border: transparent;
        font-family: Tahoma;
        font-size: small;    
        padding: 0 10px 0 20px;
        background: url('../Imagens/print.gif') no-repeat left center;   
        cursor:pointer;
        width: 18px;
    }   
    
    .BotaoImprimir:hover
    {
        background-color: #CFDEEA;
        border: transparent;
    }
    
    /* Botão LIMPAR. Propriedades Alteradas:
    	- Borda
    	- Nome da Letra
    	- Tamanho da Letra
    	- Curso
    	- Imagem */
    .BotaoLimpar
    {   
        border: transparent;
        font-family: Tahoma;
        font-size: small;    
        padding: 0 10px 0 20px;
        background: url('../Imagens/clear.gif') no-repeat left center;   
        cursor:pointer;
        width: 18px;
    }   
    
    .BotaoLimpar:hover
    {
        background-color: #CFDEEA;
        border: transparent;
    }
    
    .botaoDownload
    {   
        border: transparent;
        font-family: Tahoma;
        font-size: 12px;    
        padding: 0 10px 0 20px;
        background: transparent url('images/Dowload.gif') left center no-repeat;   
        cursor:pointer;
    }   
    
    .botaoDownload:hover
    {
        background-color: #CFDEEA;
        border: transparent;
    }
    
    
    /* Botão ALTERAR SENHA. Propriedades Alteradas:
    	- Borda
    	- Nome da Letra
    	- Tamanho da Letra
    	- Curso
    	- Imagem */
    .BotaoAlteraSenha
    {   
        border: transparent;
        font-family: Tahoma;
        font-size: small;    
        padding: 0 10px 0 20px;
        background: url('../Imagens/Alterar_Senha.gif') no-repeat left center;   
        cursor:pointer;
        width: 18px;
    }  
     
    .BotaoAlteraSenha:hover
    {
        background-color: #CFDEEA;
        border: transparent;
    }
    
    /* Botão DESATIVAR USUARIO. Propriedades Alteradas:
    	- Borda
    	- Nome da Letra
    	- Tamanho da Letra
    	- Curso
    	- Imagem */
    .BotaoDesativarUsuario
    {   
        border: transparent;
        font-family: Tahoma;
        font-size: small;    
        padding: 0 10px 0 20px;
        background: url('../Imagens/Desativar.gif') no-repeat left center;   
        cursor:pointer;
        width: 18px;
    }   
    
    .BotaoDesativarUsuario:hover
    {
        background-color: #CFDEEA;
        border: transparent;
    }
    
    
    /* Botão NOVO CONTATO. Propriedades Alteradas:
    	- Borda
    	- Nome da Letra
    	- Tamanho da Letra
    	- Curso
    	- Imagem */
    .BotaoNovoContato
    {   
        border: transparent;
        font-family: Tahoma;
        font-size: small;    
        padding: 0 10px 0 20px;
        background: url('../Imagens/contato.gif') no-repeat left center;   
        cursor:pointer;
        width: 18px;
    }  
     
    .BotaoNovoContato:hover
    {
        background-color: #CFDEEA;
        border: transparent;
    }
    
    .BotaoNoShow
    {   
        border: transparent;
        font-family: Tahoma;
        font-size: small;    
        padding: 0 10px 0 20px;
        background: url('../Imagens/saveClose.gif') no-repeat left center;   
        cursor:pointer;
        width: 25px;
    }   
    
    .BotaoNoShow:hover
    {
        background-color: #CFDEEA;
        border: transparent;
    }
    
    /* Separador de Seção. Propriedades Alteradas:
    	- Estilo da Borda
    	- Cor da Borda
    	- Texto Negrito
    	- Altura
    	- Tamnho da Borda*/
    .SeparadorSecao
    {
    	border-bottom-style: solid;
    	border-bottom-color: #6699CC;
    	font-weight: bold;
    	height: 18px;
    	border-bottom-width: 1px;	
    }
    
    /* Campo Obrigatório */
    .CampoObrigatorio
    {
    	color: #FF0000;
    }
    
    /* Define a altura das linhas da Tabela 
    Propriedades Alteradas: 
    	- Altura */
    .AlturaLinhaTabelaTD
    {
        height: 28px;
    
    }
    
    /*Aba Ocorrencia
       Início */
    #menuAba:
    {
    	/*background: #000;*/
    	
    		margin: 0;
    		padding: 0;
    	width: 877px;	
    }
    
    
    #menuAba ul li 
    {
    	display: inline;
    }
    
    #menuAba ul li a
    {
    	background-image: url('../Imagens/appmenu_back.gif' );
    	color: #000000;
    	border-bottom: 1px #000 solid;
    	float: left;
    	padding: 5px 7px;
    	margin: 1px;
    	text-decoration: none;
    	border-style: solid solid none solid;
    	border-width: 1px;
    	background-repeat: repeat-x;
    	text-align: center;
    	border-color: #898C95;
    	font-family: Tahoma;
    }
    
    #menuAba ul li a:hover
    {
    	background-image: url('../Imagens/appmenu_back.gif' );
    	color: #15428B;
    	border-bottom: 1px #000 solid;
    	float: left;
    	padding: 5px 7px;
    	margin: 1px;
    	border-style: solid solid none solid;
    	border-width: 1px;
    	background-repeat: repeat-x;
    	text-align: center;
    	border-color: #898C95;
    	font-family: Tahoma;
    }
    /*FIM*/
    
    #container {
    	;
    	width: 100%;
    	margin: 0 auto;
    	padding: 0px;
    	text-align: left;
        top: 0px;
        left: -83px;
        height: 548px;
    }
    
    a 
    {
    	padding: 0 0 7px 0;
    	height: 22px;
    	color: #27537a;
    	font-size: 12px;
    }
    a:hover 
    {
    	color:#000033;
    }
    #menu .current 
    {
    color:#000033;
    font-weight:bold;
    }
    
    #main {
    	margin: auto;
    	/*background: url(Imagens/bg_main.gif) repeat-y;*/
    	background: #CFDEEA url('../Imagens/background.gif') repeat-x;
    	width: 100%;
    	height: 555px;
    	text-align: left;
    	font: 12px Tahoma;
    }
    
    #Cabecalho
    {
    	margin:0; 
    	top:0; 
    	right:18px; 
    	display:block; 
    	width:100%; 
    }
    
    #Corpo
    {
    	display:block; 
    	height:100%; 
    	max-height:100%; 
    	width:100%;	
    	z-index:3;
    	top:58px;
    }
    
    #Rodape
    {
    	;
    	margin:0; 
    	bottom:-1px; 
    	right:18px; 
    	display:block; 
    	width:100%; 	
    	z-index:4;
    	top:550px;
    	text-align:center;	
    }
    
    /* Menu */
    
    div.menuWin
    {
    	width: 160px;
    	border: 1px solid #6699CC;
    }
    
    div.menuWin a
    {
    		display: block;
    		padding-left: 3px;
    		padding-right: 3px;
    		margin: 0px;
    		border: 0px;
    		line-height: 20px;
    		color: #000000;
    		text-decoration: none;
    		outline: none;
    }
    
    * html div.menuWin a { height: 1%; }
    
    div.menuWin a { height: 1%; }
    
    div.menuWin a:hover
    {
    	background-color: #B2C9EA;
    	color: #FFFFFF;
    }
    
    ul.menuWin-body
    {
    		margin: 0px;
    		padding: 0px;
    		width: 160px;
    }
    
    ul.menuWin-body li
    {
    		display: block;
    		margin: 0px;
    		padding: 0px;
    		list-style: none;
    		clear: both;
    }
    
    ul.menuWin-body li div
    {
    		width: 20px;
    		float: left;
    		margin: 0px;
    		margin-right: 5px;
    		padding: 0px;
    }
    
    ul.menuWin-body li img
    {
    		margin: 2px;
    		width: 16px;
    		height: 16px;
    		padding: 0px;
    		border: 0px;
    		vertical-align: middle;
    }
    
    span.menuWin-arrow
    {	
    		display: block;
    		width: 158px;
    		position : absolute;
    		text-align: right;
    }
    
    span.menuWin-arrow img
    {
    		padding: 3px 2px;
    		cursor: pointer;
    		width: 15px;
    		height: 15px;
    }
    
    span.menuWin-header
    {
    	display: block;
    	margin: 0px;
    	padding: 0px;
    	padding-left: 5px;
    	line-height: 18px;
    	color: #15428B;
    	font-weight: bold;
    	background-image: url(  '../Imagens/form_toolbar_back.gif' );
    	background-repeat: repeat-x;
    	font-family: Tahoma;
    }
    
    /* Define as Propriedades do Componente de ABA do Ajax (TabControl)
    Height="356px" 
                Width="815px" style="padding-left:15px"
    /* Opção 2: Xp Theme */
    
    .ajax__tab_xp .ajax__tab_header {background:url(<%=WebResource("AjaxControlToolkit.Tabs.tab-line.gif")%>) repeat-x bottom;}
    .ajax__tab_xp .ajax__tab_outer {padding-right:0px;background:url(<%=WebResource("AjaxControlToolkit.Tabs.tab-right.gif")%>) no-repeat right;height:21px;}
    .ajax__tab_xp .ajax__tab_inner {padding-left:0px;background:url(<%=WebResource("AjaxControlToolkit.Tabs.tab-left.gif")%>) no-repeat;}
    .ajax__tab_xp .ajax__tab_tab {height:0px;padding:0px;margin:0;background:url(<%=WebResource("AjaxControlToolkit.Tabs.tab.gif")%>) repeat-x;}
    .ajax__tab_xp .ajax__tab_hover .ajax__tab_outer {background:url(<%=WebResource("AjaxControlToolkit.Tabs.tab-hover-right.gif")%>) no-repeat right;}
    .ajax__tab_xp .ajax__tab_hover .ajax__tab_inner {background:url(<%=WebResource("AjaxControlToolkit.Tabs.tab-hover-left.gif")%>) no-repeat;}
    .ajax__tab_xp .ajax__tab_hover .ajax__tab_tab {background:url(<%=WebResource("AjaxControlToolkit.Tabs.tab-hover.gif")%>) repeat-x;}
    .ajax__tab_xp .ajax__tab_active .ajax__tab_outer {background:url(<%=WebResource("AjaxControlToolkit.Tabs.tab-active-right.gif")%>) no-repeat right;}
    .ajax__tab_xp .ajax__tab_active .ajax__tab_inner {background:url(<%=WebResource("AjaxControlToolkit.Tabs.tab-active-left.gif")%>) no-repeat;}
    .ajax__tab_xp .ajax__tab_active .ajax__tab_tab {background:url(<%=WebResource("AjaxControlToolkit.Tabs.tab-active.gif")%>) repeat-x;}
    .ajax__tab_xp .ajax__tab_body {border:1px solid #b0c2d0;border-top:0; width:100%; height:902px;  overflow:auto;
                                   padding:0px;background:url(../Imagens/background.gif) top center repeat-x #CFDEEA}
    
    /* Propriedade scrolling  */
    /*.ajax__scroll_horiz {overflow-x:scroll;}
    .ajax__scroll_vert {overflow-y:scroll;}*/
    .ajax__scroll_both {overflow:scroll}
    .ajax__scroll_auto {overflow:auto}
    
    
    /* DUPLICIDADE //////////////////////// */
    
    .Texto
    {
    	font-family: Tahoma;
    	font-size: 11px;
    	color: #333333;
    	
    }
    .Titulo
    {
    	font-family: Tahoma;
    	font-size: 16px;
    	color: #fff;
    	font-weight: bold;
    	text-decoration: underline;
    	
    }
    
    .BotaoSimNao{
            font-size:10px;
            font-family:Tahoma;
            font-weight:bold;
            color:white;
            background:#638cb5;
            border:0px;
            width:80px;
            height:19px;
           }
           
    .tdTitulo
    {
    	background-color: #638cb5;
    	text-align:center;	
    }
    
    .AlturaTab
    {
    	overflow:scroll;
    }
    


    quinta-feira, 7 de março de 2013 21:03
  • Os browsers são diferentes. É muito difícil fazer uma página com muitos recursos e que fique idêntica em qualquer browser. Você disse que seu javascript só funciona no IE, quando for utilizar várias linhas de javascript assim, sugiro que use jQuery, que é testado e feito para ser multi-plataforma.

    Quanto ao css, é outro problema, 100% igual quase nunca fica. Acesse o YouTube pelo IE, pelo Chrome e pelo FireFox, se você reparar bem, irá encontrar pequenas diferenças, quase não da pra ver, mas verá que existem pequenas diferenças. Eu acredito que uma página tenha que ser desenvolvida de uma forma que não fique dependendo muito de compatibilidade de navegador (nada css mirabolantes). Concordo quando o amigo Paulo diz: "o melhor modo ainda é adaptar da melhor forma possível sua classe para que funcione de forma satisfatória em todos os navegadores."

    Existem também algumas bibliotecas como http://modernizr.com/ que ajudam no quesito browser support.


    Ao infinito e além!

    quinta-feira, 7 de março de 2013 21:52
  • Eu fiz um teste com seu menu e não consegui fazer ele funcionar no FireFox tb, eu não sou programador Cliente Side e minhas habilidades talvez não sejam muito apurada para saber oque teria que fazer para que funcionasse.

    Acho plausível seguir o conselho do Fabio e utilizar uma biblioteca como o Jquery para algo mais complexo. Quando vamos trabalhar com linguagens que depende do navegador interpretar temos que tomar este tipo de cuidado.

    Da uma olhada aqui " Juice ", tem vários elementos para vc implementar em seu projeto.

    quando solucionar o seu problema não deixe de dar um FeedBack, para que outras pessoas com o mesmo problema que o seu consigam resolver tb.


    Paulo Marcelo Dalbosco

    sexta-feira, 8 de março de 2013 12:05
  • pessoal, obrigada pelo retorno..

    como o projeto já foi desenvolvido, vcs acham que seria viável esse tipo de manutenção?

    sexta-feira, 8 de março de 2013 17:18
  • Depende.

    Faz tempo que o projeto esta rodando? Esta satisfatório o Menu funcionar apenas no IE?

    O Analista aceita o menu funcionar apenas no IE?

    As pessoas que entrarem com outros navegadores, como irão navegar pelo site sem o Menu?

    Existem sites que eles simplismente "trancam" o usuário se ele usar certos navegadores.

    Um exemplo é o site da Caixa Econômica, que funciona apenas com o IE.


    Paulo Marcelo Dalbosco

    sexta-feira, 8 de março de 2013 17:24
  • o projeto ainda não foi disponibilizado.. ele vai ser acessado por um link de dentro de outro projeto, e esse link só estará disponível se a pessoa acessar pelo IE, no caso de outro navegador, irá aparecer uma mensagem solicitando que use o IE..

    a preferência é que se adapte o projeto.. mas tecnicamente me parece que isso levará um bom tempo, para um projeto que funciona hoje, não sei se valeria a pena..

    esse projeto foi desenvolvido por uma empresa terceira.. não fomos nós que desenvolvemos.. por isso a dificuldade.. 

    não conheço muito de web, js e css.. mas pelo pouco que entendo, praticamente seria "refazer" essas classes.. 

    estou certa?

    sexta-feira, 8 de março de 2013 17:40
  • Não, por exemplo.

    A classe CSS vc vai incluir apenas oq for pertinente ao menu. E na página irá referenciar a biblioteca do JQuery.

    E o menu sim vc irá substituir pelo novo, junto com o JS.

    Tem menus que funcionam apenas com CSS, vc ja deu uma olhada?

    Um exemplo

    http://www.mycssmenu.com/visual_interface/tree_menu/template.html

    Ou vc tem a nessessidade do Menu ser em JS?


    Paulo Marcelo Dalbosco


    sexta-feira, 8 de março de 2013 17:54
  • não.. até que não tenho necessidade que o menu seja apenas em JS.. 

    vou da uma olhada nesse exemplo, na suas soluções e sugerir..

    sexta-feira, 8 de março de 2013 18:12