Hacks CSS IE 9-10

[andersonseifert 10]

Pessoal tenho muita dificuldade em estar migrando um site que desenvolvi roda no FIREFOX E CRHOME

mas nao roda no IE8 9 E 10 Algum tem algum material para me ajudar para que possa adquir conhecimento ?

[bruno_mosciatti 22]

como assim não roda no IE9 e 10?! Ele tem que rodar! pelo menos o HTML tem que estar certo.

Poderia postar print comparando firefox com IE?

 

Normalmente acontecem alguns problemas de CSS com o IE (principalmente versões antigas 7 e 8) mas com o tempo você adquire conhecimento e vai estar preparando a montar um site pensando nas possibilidades de quebra de layout nessas porcarias de navegadores, fique tranquilo!

 

As dicas inicais que posso lhe dar para arrumar problemas no IE : ABUSE do float!!! float:left pra todas divs ul's e li's !!!! DEFINA tamanhos!!! height e width para tudo.

[andersonseifert 10]

Entao algumas tecnicas eu ja domino mas assim tem coisas que tenho difuculdade que sao essas compatibilidades do CSS mesmo

como border-radius no IE8,9,10 Eu uso o MOZ mas nao roda do mesmo jeito .

-moz-border-radius: 8px;
-webkit-border-radius: 8px;

[bruno_mosciatti 22]

Entao algumas tecnicas eu ja domino mas assim tem coisas que tenho difuculdade que sao essas compatibilidades do CSS mesmo

como border-radius no IE8,9,10 Eu uso o MOZ mas nao roda do mesmo jeito .

-moz-border-radius: 8px;

-webkit-border-radius: 8px;

 

Cara, o MOZ significa MOZILLA, ou seja... FIREFOX! Você não precisa utilizar esse hack para o firefox, visto que só de usar o border-radius ele já reconhece.

O border-radius já funciona nas versões a partir do 9 do internet Explorer.

[andersonseifert 10]

Nao funcionou nao meu i Eé o 9 ,

De uma olhada no meu Codigo :

 

#menu {
    width: 955px;
    height: 25px;
    margin-top: 7px; /* POSICAO MENU*/
     }
#menuver {
    border: none;
    margin: 0px;
    font: 14px Calibri;
    font-weight: bold;
    padding-left: inherit
    }
#menuver li {
    list-style: none;
    margin: 0;
    display: inline;
    }
#menuver li a {
    -moz-border-radius: 5px;   /*Firefox*/
    -webkit-border-radius: 5px;   /* Chrome e Safari */
    border-radius: 4px;  /* Outros Navegadores */
    padding: 5px 38.8px;/*LARGURA E TAMANHANO MENU*/
    margin: 0;
    border: 0px;
    background:#304733; /*COR MENU PRINCIPAL*/
    text-decoration: none;
    color: #FF0;
    }/*COR LETRA MENU PRINCIPAL*/
#menuver li a:link {
    color: #FF0;
    }
#menuhor li a:visited {
    color: #060;
    }
#menuver li a:hover {
    background: #FC3;/*COR FUNDO MENU PRINCIPAL*/
    color: #060;/*COR LETRA FUNDO*/
    border-color: #FFFF00;
    }

[bruno_mosciatti 22]

 

Nao funcionou nao meu i Eé o 9 ,

De uma olhada no meu Codigo :

 

#menu {
    width: 955px;
    height: 25px;
    margin-top: 7px; /* POSICAO MENU*/
     }
#menuver {
    border: none;
    margin: 0px;
    font: 14px Calibri;
    font-weight: bold;
    padding-left: inherit
    }
#menuver li {
    list-style: none;
    margin: 0;
    display: inline;
    }
#menuver li a {
    -moz-border-radius: 5px;   /*Firefox*/
    -webkit-border-radius: 5px;   /* Chrome e Safari */
    border-radius: 4px;  /* Outros Navegadores */
    padding: 5px 38.8px;/*LARGURA E TAMANHANO MENU*/
    margin: 0;
    border: 0px;
    background:#304733; /*COR MENU PRINCIPAL*/
    text-decoration: none;
    color: #FF0;
    }/*COR LETRA MENU PRINCIPAL*/
#menuver li a:link {
    color: #FF0;
    }
#menuhor li a:visited {
    color: #060;
    }
#menuver li a:hover {
    background: #FC3;/*COR FUNDO MENU PRINCIPAL*/
    color: #060;/*COR LETRA FUNDO*/
    border-color: #FFFF00;
    }

 

Cara, o IE9 suporta o border-radius. Verifique se não está em algum modo de navegação aí, modo quirks ou sei lá.

[andersonseifert 10]

 

 

é to lascado mas obrigado :/

 

 

 

 

Alguem me ajude . .

[Ricardo Barantini 33]

Tente usar a tag -ms- (IE) para as propriedades do CSS3, além também de incluir a -o- (Ópera).

[andersonseifert 10]

nao Funfo Ricardo (-ms-border-radius: 5px;)

[Maykel-ctba 233]

Estranho. Border Radius funciona SIM no IE9/10.

 

Seguinte, aperte F12 no seu IE, e veja se não está em modo de compatibilidade. As vezes seu IE9 está rodando como IE8/7.

[andersonseifert 10]

UPPP Funfo tava faltando :MUITO OBRIGADO de verdade valeu .

 

<!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" />

[bruno_mosciatti 22]

Foi o que eu disse desde o início né ¬¬

[andersonseifert 10]

Verdade nao prestei atenção Obrigado Tambem ...