Problema com posicionamento de imagem dentro de tabela

[Juliano.net 2]

Galera, no design do site que estou trabalhando, há quadros que possuem bordas arredondadas e dentro de cada quadro há uma figura temática que fica junto a borda, porém a parte central da tabela eu fatiei como uma única célula pois quando o texto ao lado da imagem exceder o espaço disponível, ele passa para a linha abaixo da imagem.

 

Porém a imagem fica com um espaço em branco à esquerda, daí tive que colocar margin-left: -3px. Até aí tudo bem, funcionou no Internet Explorer, mas quando testei no Opera não obtive sucesso. Então alterei pra margin-left: 0px e funcionou no Opera, mas não no IE.

 

Então resolvi usar um CSS Hack, fazendo assim <img .... style="margin-left: 0px; _margin-left: -3px">

 

Pois já que o IE aceita o sublinhado antes da propriedade, então especifiquei uma configuração para IE e uma para Opera e outros. Porém, como já sabem, este código não será validado pelo W3C Validator. Há alguma outra forma de se fazer isso sem Hacks, ou com Hacks que sejam validados?

 

O que eu estou fazendo pode ser visto nesta imagem: http://www26.brinkster.com/julianonunes/teste.jpg

 

Valeu

[pa_bruno 0]

eh soh fazer uma busca... <_<

* html .classe { margin-left: -3px; }

[Juliano.net 2]

O asterisco (*) faz parte do código??O que esse código de diferente para que apareça com o mesmo visual no Opera, Firefox e Internet Explorer? Lembrando que do modo que fiz, o IE necessitava de ter a margem como -3px e o Firefox e Opera necessitara de margem como 0px.

[pa_bruno 0]

esse eh o hack para o i.e. q eh validado pela W3C