por Diego Eis
Maio 2nd, 2007
Um aluno estava tendo um problema de compatibilidade: o layout funcionava em Firefox e IE6, mas quebrava em IE7. Para resolver, ele utilizou aquele hack do * (asterísco) no começo da propriedade. O problema é que este csshack do asterísco também funciona no IE6. Se ele arrumasse o IE7, o IE6 que quebrava por causa do hack. Isso é fácil de resolver, veja o código:
#conteudo{
float:right;
width:517px;
vertical-align: top;
margin-right:10px; /* Todo mundo entende */
*margin-right:15px; /* IE6 e IE7 entendem */
_margin-right:10px; /* IE6 entende */
}
Primeiro você usa a linha de código normal. Esta linha todos os browsers entendem.
Depois, logo abaixo, você coloca o csshack do asterísco, que funcionará em IE6 e IE7.
Para forçar o IE6 a ter o valor correto, você usa o csshack do ‘underline’ no começo da propriedade. Como essa linha está vindo logo após do hack do asterísco, o valor do IE6 vai ser sobreescrito.
Horrível né? Paciência.
Fiz uma busca rápida para ver se encontrava outra solução, mas achei este site com a mesma solução acima.
Se ainda estiver interessado, leia também:
Este post foi criado
na Quarta-feira, Maio 2nd, 2007 às 12:47 e está arquivado em Tecnologia e Tendências.
Você pode seguir as atualizações pelo feed: RSS 2.0.
Você pode deixar um comentário, ou deixar um trackback de seu próprio site.
Ou usar comentários condicionais né?
Concordo com o Camilo, os comentarios estao ai para serem usados, de maneira semantica…
Concordo com o Camilo… também acho que o uso de Conditional Comments deixaria mais clara e mais decente essa solução.
E ae Diego, sou eu novamentee… então cara, só uma sugestão: o anuncio do google está sobre o div amarelo q está listando o código!!!
abraços
Franklin Javier
Guarujá/SP
Quando fiz o re-align no design do Tecnocracia, baseei-me inicialmente no Firefox. Depois testei no IE6 e IE7 e o layout quebrou nos dois (muito mais no 6).
Verifiquei item por item e fui adicionando atributos no estilo original, de forma que precisasse do mínimo de hacks possível. O resultado é que consegui com comentários condicionais, atender só ao IE6 e suas especificidades, com poucas linhas de CSS.
Os IE tem uma característica chata. Se você definir, por exemplo, posicionamento absoluto e o valor para top (sem definir o valor de left), o layout detona, mesmo que você defina margens de acordo. O FF aceita como “inherit” o valor não definido, já o IE reclama 
Abraço
Hacks com o IF IE são realmente mais “corretos”, porem em algumas ferramentas mais fechadas não tem como se aplicar isso, pois a chamada do CSS esta dentro do sistema e algumas dificuldades extras impedem, por exemplo de chamar um novo CSS ou de colocar as coisas corretamente.
Seria legal se existisse um seletor, como o @media: print, mas para browsers, na verdade melhor seria ainda se todos os browsers tivessem o mesmo comportamento e renderização.
horrível é pouco..
e é necessária muita paciência…
Bom…tenho visto ao longo das notícias e comentários contidos aqui, que todos comentam sobre o não funcionamento do _(underline) no IE7. Queria dizer que tenho desenvolvido sites e o IE7 aceita esse hack sem problemas. Estou postando por que estou realmente surpreso ao ver os comentários, e queria saber se sou o único a conseguir o uso desse hack no IE7.
Viva ao Firefox, viva ao Open source!!!
concordo com o que disseram comentários condicionais…
e realmente é preciso paciência demais
Que são horriveis isso é verdade.., mas necessários…
Nos post anterior falando sobre CSSHacks aqui no Tableless eu escrevi em um comentário um exemplo de “comentários condicionais” e vários links sobre o assunto! Ao que parece o Diego Eis esta ignorando ou ainda não entendeu a única coisa que a microsoft fez de util no seu browser!
Pela ultima vez, esqueça tudo que aprendeu até hj de CSSHacks para IE e leia:
http://www.maujor.com/tutorial/condcom.php
Olá à todos,
Eu gostaria de saber o que vocês acham de usar mais de um CSS, ou seja, um para cada tipo de navegador. Algo do tipo: css.css para navegadores descentes, e todos os hacks ficariam assim: css_ie6.css e css_ie7.css.
A seleção seria assim:
Dentro desses CSSs alternativos iriam apenas os hacks para cada um dos navegadores.
Dessa maneira, evita-se a utilização dos hacks direto no CSS e têm-se, sempre que possível, um CSS validado.
A pergunta é: Qual é o melhor e “menos errado” método de se controlar isso.
Vale à penas sujar o CSS por conta dos navegadores maravilhosos da MS?
Abração!
Faltou o código que entra no header. conta do filtro HTML! Sorry!
Olha a situação que o IE nos coloca: ter que fazer hack do hack…. se o IE fosse um browser descente nem precisaria de hacks
é soh criar o arquivo ie_hacks.css e incluir com comentário condicional logo após o css principal
#conteudo{
*margin-right:15px; /* IE6 e IE7 entendem */
_margin-right:10px; /* IE6 entende */
}
[]’s
Acho que comentário condicional tira uma das vantagens do tableless:
“Você terá um a única versão do site funcionando em qualquer navegador”
Nunca usei, e pretendo nunca usar, mas respeito a preferência dos demais
[]’s
Assim funciona só no IE7:
*+html{}
Dá-lhe Microsoft, que ao invés de diminuir, aumentou nossa dor de cabeça ¬¬
Eu prefiro usar CSS separadas.. para os navegadores.. isso é errado???
#conteudo{
_margin-right:10px; /* IE6 entende */
}
body > #conteudo {
margin-right:10px; /* Todo mundo entende */
*margin-right:15px; /* só IE7 entende */
}
pelo menos sá uma separa a mais =D
Muito, muitoo bom isso! ^^
Olá Cristia,
Era essa mesmo a minha pergunta, mas parece que ninguém respondeu! @
Abraços,
“Certo é o que funciona” - diz o meu professor de Kung Fu!
Más as vezes existem várias maneiras que funcionam, cabe a você escolher uma…
Eu acho que os comentários condicionais são a melhor saída, uma vez que um comentário não deveria ser interpretado pelo browser. Como o IE possui uma sintaxe que ele (e somente ele) entende, acho que é uma maneira “mais semântica” do que ficar colocando lixo no CSS…
Eu ainda prefiro usar o condional comments, pq do jeito q a microsoft eh doida…eh bem capaz q numa atualizacao eles removam esse suporte aos hacks como * e _ e kem tah usando vai ter q aderir aos conditional comments…=/
Irresistivel…www.ie7.com
Está virando um transtorno implementar em CSS, tá dando medo! me preocupo em resolver mais incompatibilidades do que o próprio desenvolvimento em si.
Ninguém vê isso??? cade os padroes????
Gente, também tô meio encucado com isso, mas me atento a dois pontos:
1º - E a validade do CSS pela w3c, ignora ou não?
2º - Como já comentado acima, será que não usar CSSs para Navegadores de verdade e CSS para ieca não seria uma boa opção, pra quem usa PHP fica fácil fazer isso, é só identificar o browser…
Enfim, acho ainda que a melhor opção é tentar fugir ao máximo de CSSHacks e Comentários Condicionais, eu pelo menos faço de tudo para não usá-los, e a única coisa que uso hoje em dia para diferenciá-los, é o também famoso, mas pelo jeito esquecido aqui, !important, que funfa em qualquer “browser de verdade”, menos no ieca (tá aí, não sei se funfa no IE7)
vlw
Cara o código fica horrível… E eu tenho muita mania de código organizado…
Funcionando ou não, nunca usei hacks…
Acredita que eu consegui fazer meu “site” rodar perfeitamente no FF e IE6 sem nenhum hack? o.o
Imagino que no IE7 esteja ok também…
Acho que esta solução chega a ser meio obvia.
E Dalhe briguinha de browser!!
Programador visual ou não sempre teve e sempre tará essa briga, graças a Deus eu trabalho entre outras coisas com sistemas voltados apra Web e praticamente imploro para meus clientes usarem o IE para nao ter que escrever 1000 linhas a mais de codigo só para ficar coparando IE e FF, o FF tem muitas limitações por incrivel que pareça e a maioria são com relação a JavaScript, ja melhorou bem, mas tem coisas bobas que eles esquecem, versão após versão.
IE na cabeça e FF como opção!! Adoro os 2 mas nao tiro o IE nem a pau!!
Quantos de vc´s leram pelo menos 20% das paginas do W3C sobre CSS e HTML? Leiam e parem de criticar tanto o IE como o FF, padrao nenhum deles segue, a prova disso são os HACKS FF -moz da vida que vivem aparecendo e SÓ FUNCIONAM NO FF.
huahuahuauhua… Esse Ieca eh brincadeira mesmo!!!
ae Galera,
1 - Será que a intenção da MS não é essa mesmo de dificultar a vida dos desenvolvedores ?, afinal o IEK é o browser mais utilizado no mundo.
2 - Tenho uma sugestão: colocar em todos os nossos trabalhos sempre na página inicial um aviso para os usuários, por exemplo:
[Este site é melhor visualizado no Firefox]
é uma das muitas formas de ganharmos mais usuários pro Firefox e também podemos trabalhar mais dentro dos PADRÕES da W3C, assim os usuários que utilizam o IEK percebendo que há algo errado no site, terão a opção de instalar o Firefox e assim talvez mudar essa triste realidade sobre o IKE.
Entendo que simplesmente lamentarmos a SACANAGEM da MS, não nos leva a lugar algum, por isso sugiro que façamos algo mais concreto do que simplesmente reclamar.
Abraço a todos.