Ontem precisei de um hack para IE7. Fiz uma busca rápida e encontrei algo bem fácil.
Lembra do csshack para IE que você colocava um _ (underline) na frente da propriedade que você gostaria que só o IE entendesse? Pois é… ele não funciona no IE7. Mas… se trocarmos o _ (underline) por * (asterísco) ele passa funcionar!
div {
background:green;
*background:red; /* essa linha funciona no IE7 */
}
Fizeram o underline parar de funcionar, mas esqueceram do asterísco.
49 Comentários
Pedro Rogério 26/04/2007 às 08:44
*+html div{background:green;}Rael B. Riolino 26/04/2007 às 08:52
vai precisar mesmo…
o IE7 só veio parar complicar ainda mais a nossa vida!
Valeu pela dica! Muito útil! ;-D
Abraço
Rael
Danilo Cesar 26/04/2007 às 09:05
Mas funciona também no IE6, ou preciso definir 2 hacks?
Bruno F. Santos 26/04/2007 às 10:27
Poxa dessa eu não sabia ..
eu precisei de hack pra IE7 algumas vezes já
mais eu sempre usava isso:
< ! -- [if IE 7] >
< link rel="stylesheet" type="text/css" href="css/iehack.css" />
< ! [endif] - - >
ae quando fosse o IE7 ele lia o css e arrumava ..
vou testar essa do asterisco tb!
haha
valeu!
desconsidera os outros comentarios
Mariorez 26/04/2007 às 10:34
Eu uso e recomendo o “CSS Browser Selector”:
http://rafael.adm.br/css_browser_selector/
JavaScript simples e prático que resolve meus problemas de CSS Cross-Browser / Cross-Os:
Browsers:
* ie – Internet Explorer (All versions)
* ie6 – Internet Explorer 6.x
* ie5 – Internet Explorer 5.x
* gecko – Mozilla, Firefox, Camino
* opera – Opera (All versions)
* opera8 – Opera 8.x
* opera9 – Opera 9.x
* konqueror – Konqueror
* webkit or safari – Safari, NetNewsWire, OmniWeb, Shiira
Os:
* win
* linux
* mac
Carlos 26/04/2007 às 10:36
Esse metodo de hack não seria melhor? Faz a melhor forma no IE e depois hackeia pros demais browsers (FireFox)…
http://www.revolucao.etc.br/archives/hacks-hack-hacks
Julio Fragoso 26/04/2007 às 11:14
Essa eu sabia, o chamado star hack !
quanto ao do Rael, acho que o IE 7 consertou muitos bugs de renderização, mas ainda restam outros, e acho que está melhor que o IE 6.
Mas falta muito para ficar nível ótimo.
Ederson Spader 26/04/2007 às 12:26
Pensava que não mais seria necessário o uso de hacks! mais fazer o que
William Grasel Martins 26/04/2007 às 12:27
Ao que parece vocês ainda não descobriram os conditional comments…
O link original da Microsoft explicando o assunto esta dando 404, mas tem esse no IEBlog.
Resumindo, em vez de desvalidar seu CSS com um hack como o que foi citado neste post, ou ficar pesquisando seletores que não funcionam no IE7 para usar como hacks, você pode fazer apenas isso:
<!--[if IE 7]>
<link rel="stylesheet" type="text/css" href="iehacks.css" />
<![endif]-->
Veja o link original, atualmente quebrado, caso volte a funcionar ou a página do Maujor explicando o assunto.
Abraços!
Ved 26/04/2007 às 12:48
É impressionante como a Microsoft não aprende a fazer as coisas direito. Sempre dificultando a nossa vida! Um inferno!
Rickks 26/04/2007 às 18:28
Interessante testar nos três browsers
background-color: #FFF; Firefox
*background-color: #afafaf; IE 7
_background-color: #000000; IE 6
quem tiver o IE 7 e quiser testar com IE 6,
mas nao sabe como ter as 2 versões,
é so baixar esse programinha aqui
http://tredosoft.com/Multiple_IE
ele instala o IE3 IE4.01 IE5 IE5.5 e IE6
Rodrigo Kono 26/04/2007 às 18:53
Olá Diego. Tudo bem? Conversava contigo nos tempos do ICQ. Faz tempo hein…
Admiro seu trabalho e seu site. Sempre tem boas coisas… Acho show. Mas sinceramente sou contra os CSS Hacks. Acho que sempre existem formas de fazer ambos funcionarem bem sem HACKS. É minha opnião. E outra: Hacks invalida o CSS. =)
Abração velho.
Anderson Sá 26/04/2007 às 19:12
O ideal seria não precisar de hack, mas como nem sempre as coisas são como a gente quer. É jeito!
Gustavo Moraes 26/04/2007 às 23:24
mto util esse post!!!
eu tava precisando do hack esses dias!! e tive q mudar o jeito q tava fazendo, pq nao sabia o hack pra IE 7!! Parabens! valew!
Fill 27/04/2007 às 09:23
Dessa eu não sabia mas não seria melhor usar comentários condicionais?
Nickael Almeida 27/04/2007 às 13:23
Ola Galera…
Gostei do post a nível de conhecimento.
Mais também prefiro usar os comentários condicionais penso que deixa nosso código mais elegante. :d
Jorge Epuñan 27/04/2007 às 15:51
conditional comments eh a solucao para IE, e valida o CSS.
Jhony 27/04/2007 às 18:17
Descobriste o Brasil, véi!
Rafael Dourado 27/04/2007 às 19:05
Meu IE7 está lendo o hack com underline.
Augusto 28/04/2007 às 01:25
Pq o IE aceita isso e o Firefox não?
Pq a M$ faz o browser tosco deles aceitarem essa porcaria?
nerd.blog » Blog Archive » CSS Hack para IE 7 29/04/2007 às 13:53
[...] Fonte: CSS Hack para o IE 7 – se alguém precisar (Tableless) [...]
Douglas 30/04/2007 às 15:51
Estranho, aqui o IE7 não lê os underline não. Sobre os conditional comments, eles somente são melhores caso vc tenha que colocar vários hacks. No meu caso, tive que colocar 2…é muito mais pratico vc colocar dois hacks do que criar um outro css só pra isso.
E dai que não valida 100% o CSSS? Pra que essa paranoia de ter que ser 100% validado o CSS?
Renato Medina 24/05/2007 às 18:54
o firefox 2.0.0.3 também está lendo esse hack…
de uma verificada…
Klederson 28/05/2007 às 14:26
Renato não viaja não velhinho, firefox não le hack ( so pra constar estou no 2.0.0.3 agora e não le nem _ nem * nem condicional…
Valeu pelo * ae povo eu nao sabia e o IE 7 vive me dando dor de kbça como por ex o ajax nele, tive q criar uma solucao mirabolante pra poder fazer mais de uma requisição usando o xmlHTTPResquest…
Valeu mesmo!
ski 30/05/2007 às 10:29
Cara, MUITO obrigado!
Eu tava desesperado, pq essa bosta de IExplorer não funciona nada direito, coloca magens aonde não existe e td o mais, e não funciona(va) os hacks.
Eu já tinha xingado a Microsoft de todos os palavrôes que eu conhecia.. rs
Obrigado demais cara.. Salvou meus CSS. =]
Alfredo Stanquini Neto 30/05/2007 às 22:17
Exelente o * funciona direitinho, resolveu meu problema valew
Alfredo Stanquini Neto 30/05/2007 às 22:18
Excelente o * funciona direitinho, resolveu meu problema valew.
Greogy Thiago 09/08/2007 às 02:28
powss…aki nao tah funcionando nao brother…
nenhuma das opçoes..
tipo
se eu utilizar os comentários condicionais, mesmo assim, o ie 6 passa a entender o “iehacks”
e o lance do asterísco, mesmo assim ele compreende….oq estaria errado??
Thiago Azurem 24/08/2007 às 15:28
O correto é voce nao usar muitos hacks, se voce esta usando muito hack, alguma coisa voce nao esta entendendo da logica (ou logica de bugs) do CSS.
Entao, se a intencao é que nao exista muitos hacks, nao acho necessario usar para separar apenas um CSS com hacks. Se sao poucos, voce pode por um embaixo do outro sem problemas.
Acho importante o uso do quando realmente voce tem uma quantida de coisas que no IE7 diferencia, etc.
Eis minha humilde opiniao.
Thiago Azurem 24/08/2007 às 15:36
Caro Greogy,
Voce necessita obedecer hierarquicamente o hack.
Vamos supor que tenhamos que por diferentes margins (bug de margin com float) nos browsers.
margin-right:10px; – TODOS -
*margin-right:15px; – IE6 e IE7 -
_margin-right:10px; – IE6 -
Veja entao que o asterisco realmente nao resolveria seu problema, pois ambos agirão no IE 6 e 7, entao voce necessita passar o “_” para fazer apenas o do IE 6 depois.
Wagner Ramon 25/10/2007 às 11:11
Meus caros, monto sites à mais de 5 anos, e quase sempre usei div’s ao inves de tabelas. Mas depois do firefox, bem ai começou esse inferninho. Confesso que no começo odiei o firefox, mas agora que comecei com a semântica, mudei drasticamente de opinião. Agora, o i. e 7, e tudo mudou de novo. Devo dizer que concordo em partes com o Douglas, hoje tem muita paranóia com a “semantica”. Existem milhões de foruns sobre isso. Eu acho que uma meia dúzia de hacks não mata ninguém.
E tem mais. Vejam esse exemplo de hack:
margin:10px auto!important;(firefox)
margin/**/:/**/15px auto;(i.e6)
Acreditem, a w3c, valida esse código! Agora isso “burla” os padrões, não sei. Agora, no i.e 7, não conheço nenhum hack validavel.
Esse do * eu conhecia e confesso que é o que eu uso. Ainda mais quando tem position:absolute no elemento. é o que mais da diferença. Abraços a todos.
Mateus 09/01/2008 às 11:43
Muito legal…
denia 13/02/2008 às 17:44
No caso de trocar o underline por asterisco na IE 7 fica ok e nas anteriores também???
Mateus 19/02/2008 às 11:15
background-color: #FFF; Firefox
*background-color: #afafaf; IE 7
_background-color: #000000; IE 6
O problema deste código é que quando você usa algum !important não funciona.
Mas !important realmente é a melhor solução o problema é que nem sempre o ie7 obedece a isso
Nicolas Muller 03/03/2008 às 15:51
O melhor é fazer o css sem hack nenhum, basta seguir os padrões web e obedecer, os tamanhos, exemplo uma div com 600px de largura, se tiver 10px de padding, não utilize width:600px; padding:10px; utilize: width:580px; padding:10px;
você sempre deve reduzir da largura o nr de pixels que utilizar no padding.
PS, utilizem a propriedade FLOAT, ela ajuda muito…
Lucas 08/05/2008 às 23:11
PPPuuutss, só isso eu consigo burlar! Salvou minha vida, tava quebrando a cabeça com isso! Bem alguns optam pela importancia do padrão 100%, mas tb sou da opinião que, meia duzia de hacks não mata ninguém hehehehe
abraços!
Igor Negrão 10/05/2008 às 15:25
Cara.. valeu pela ajuda.
Rodrigo 26/05/2008 às 15:24
Valeu pelo post muito bom, mas agora:”mas tb sou da opinião que, meia duzia de hacks não mata ninguém hehehehe” vai se fuder!vc e ie6/7/8/*
Chris Santos 29/05/2008 às 15:55
Valeu pela dica do *, resolveu meus problemas, mutissimo obrigado!!
Roger Alves 25/06/2008 às 01:40
Você vê que coisa… eu precisei justamente de um hack para corrigir uma falha do firefox… ao que parece, algumas vezes ele não renderiza bem com o onmouseover do javascript, ao contrário do IE, que se comporta da maneira correta… então o que eu tive que fazer foi colocar da forma “errada” no css e usar esse recurso do asterisco para desconsiderar aquela formatação… coisas da vida… o IE pode não ser o melhor que há… mas o firefox também não é perfeito…
Valeu mais uma vez, Diego Eis!
Andreia 07/07/2008 às 21:34
Oi Pessoal,
Preciso da ajuda de vocês, pois sou ainda iniciante em desenvolvimento e estou criando um site para uma empresa mas, estou com problemas na hora de testar nos navegadores.
Para os links do site criei a seguinte regra em CSS:
Na hora de testar a página no Firefox 3 e Ópera 9.5, dá tudo certo, porém no IE7 as regras do link não funcionam.
Tem algum código que me ajudaria a burlar esse problema no IE7?
Ficarei muito grata pela ajuda, pois preciso terminar o site e esse problema está me atrasando o serviço todo.
Obrigada e até breve!
Andreia 08/07/2008 às 14:46
Pois é, as regras que descrevi não apareceram…
Seguem novamente:
a:link {text-decoration: none;
color: #000000;}
a:visited {text-decoration: none;
color: #666}
a:hover {text-decoration: none;
color: #fff; background:#c33;}
a:active {text-decoration: underline;
color: #ff9; background:#333;}
Quero definir que a fonte seja Arial no Internet Explorer 7 também, mas não está aparecendo quando renderizo a página.
Obrigada,
Phields 23/07/2008 às 17:28
O IE7 é muito bom, excelente navegador, o problema dele é tentar acertar os codigos, o que acaba fazendo com que tenha muito codigo mal feito espalhado por ae… Programar pra versoes de Browser (IE6 e 7 / Firefox 2 e 3) é pra poucos…
Rangel 23/08/2008 às 14:22
Valeu!!!hj msmo eu tava tentando fazer o underline funcionar e nao estava, dai resolvi ver as novidades aki no meu site preferido valeu!!!!! (*) kem será o próximo depois?? haha abraços.
LoG 18/09/2008 às 20:19
Show! Bendito Tableless! Me salvou.
Alessandro 30/09/2008 às 01:55
Valeu Diego! Eu estava precisando dessa dica.
Wanderley Rocha 04/10/2008 às 14:33
Bom dia, amigos.
Estou com um problemão com relação a utilização do a:active e o a:focus para rodar no IE6. Criei uma galeria de imagens totalmente em css. Ela funciona perfeitamente no FF2/3 e no IE7, já no IE6 ao clicar nos thumbnails continuamente, a imagem em tamanho real,em alguns momentos, não é carregada. Creio que este problema seja pq o IE6 não suporta o :active e o :focus. Será que utilizando o hack estrela no meu css eu resolveria este problema no IE6?
Agradeceria imensamente as dicas e parabéns pelo espaço.
Wanderley Rocha 04/10/2008 às 14:40
Amigos, bom dia.
Parabéns pelo espaço.
Como posso fazer para que o a:active e o a:focus sejam suportados pelos IE6 da mesma foram que funciona para o IE7 e FF3?
Criei uma galeria de imagens em css e quando rodo no IE6 algumas falhas de renderização apareceram. Será que utilizando o hack “_” à frente da classe eu corrijo esta falha?
Muito agradecido.
Abraços
Chris Benseler 14/11/2008 às 00:02
Eu achava que jamais ia precisar de um hack pro IE7 – tinha abandonado há tempos os do IE6, mas eis (sem trocadilho!) que estou aqui fazendo um freela de última hora que o cliente tá totalmente necessitado e me deparo com uma situação que vou ter que usar isso. Que beleza!