Icone Nao estao alinhados

Pela imagem me parece ser porque está tudo centralizado. Alinhe a esquerda, caso não de certo poste seu CSS.

você não colocou nenhuma aspas no codigo da ultima imagem

<img src=icones/suporte.png class=centro><span class=texto>Clique na imagem ao lado para acessar o suporte tecnico.</span>

Mil desculpas, acabei esquecendo de colocar o css.

Segue o css

html, body, form, fieldset, h1, h2, h3, h4, h5, h6, p, pre, blockquote, ul, ol, dl, address {

 margin:0;
 padding:0;
 }
 body {
 background: #fff url(graphics/bg-body.gif) repeat-x;
 font:76%/160% "Trebuchet MS",Verdana,Arial,Helvetica,sans-serif;
 }
 p {
 text-align:center;
 }
 a:link {
 color:#d42945;
 text-decoration:none;
 border-bottom:1px dotted #ffbac8;
 }
 a:visited {
 color:#d42945;
 border-bottom:none;
 text-decoration:none;
 }
 a:hover,
 a:focus {
 color:#f03b58;
 border-bottom:1px solid #f03b58;
 text-decoration:none;
 }
 table a,
 table a:link,
 table a:visited {
 border:none;
 }
 img {
 border:0;
 margin-top:.5em;
 }
 table {
 width:90%;
 border-top:1px solid #e3f1fe;
 border-right:1px solid #e3f1fe;
 margin:1em auto;
 border-collapse:collapse;
 }
 caption {
 color: #9ba9b4;
 font-size:.94em;
 letter-spacing:.1em;
 padding:0;
 margin:1em 0 0 0;
 margin-bottom:0;
 caption-side:top;
 text-align:center;
 }
 tr.odd td,
 tr.odd .column1 {
 background:#f4f9fe url(background/background.gif) no-repeat;
 }
 .column1	{
 background:#f9fcfe;
 text-align: center;
 }
 td {
 color:#678197;
 border-bottom: 1px solid #e3f1fe;
 border-left:1px solid #e5eff8;
 padding:.3em 1em;
 text-align:center;
 }
 th {
 font-weight:normal;
 color: #678197;
 text-align:left;
 border-bottom: 1px solid #e3f1fe;
 border-left:1px solid #e5eff8;
 padding:.3em 1em;
 }
 thead th {
 background:#f4f9fe;
 text-align:center;
 font:bold 1.2em/2em "Century Gothic","Trebuchet MS",Arial,Helvetica,sans-serif;
 color:#66a3d3
 }
 tfoot th {
 background:#f4f9fe;
 text-align:center;
 }
 tfoot th strong {
 font:bold 1.2em "Century Gothic","Trebuchet MS",Arial,Helvetica,sans-serif;
 margin:.5em .5em .5em 0;
 color:#66a3d3;
 }
 tfoot th em {
 color:#f03b58;
 font-weight: bold;
 font-size: 1.1em;
 font-style: normal;
 }
 img.centro {
 vertical-align: -9px;
 }
 span.texto {
 padding-left: 15px;
 font-size: 20px;
 }

Você pode fazer com listas isso. Para ficar crossbrowser, faça algo assim:

ul li{

list-style: none;
background: url(caminhoDaImagem.jpg) no-repeat left center;
padding: 0 0 0 20px;
}

como eu faço para afastar o texto para a direita da imagem ?

Use padding. Ele é que vai fazer o espaçamento.

http://forum.imasters.com.br/public/style_emoticons/default/thumbsup.gif

E como faço para centralizar a imagem e ao lado da imagem vir texto ?

poste a imagem!

É só fazer o que eu disse no post #5.

A imagem vai mudar ao passar o mouse por cima? Se não, use o list-style-image.

http://forum.imasters.com.br/public/style_emoticons/default/thumbsup.gif

me desculpe a ignorancia, mas como eu uso o list-style-image ? Nao vou usar !.

Usei aqueel codigo do post 5 ma sele nao centralizou a imagem e o texto.

Está ficando assim:

/applications/core/interface/imageproxy/imageproxy.php?img=http://img696.imageshack.us/img696/2507/imagemju.jpg&key=b5894c5769119f84bbb109afa3a9f36cc7fcddcdcfefdc4fafb2570683ae9b81" alt="Imagem Postada" />

Isso aí é só dar um margin.

http://forum.imasters.com.br/public/style_emoticons/default/thumbsup.gif

Thiago, perfeito, mas um problema, a imagem esta cortada como mostrado no link do meu post anterior, como resolver isso ?

Ué... Minha resposta anterior foi para isso... Use margin no li.

http://forum.imasters.com.br/public/style_emoticons/default/thumbsup.gif

então, aqui nao foi, a figura esta cortada ainda.

Uhhnn... Verdade... Falei errado. :P

Dá um padding no li.

http://forum.imasters.com.br/public/style_emoticons/default/thumbsup.gif

então, tb nao adiantou, a imagem ainda continua cortada !

ul {

 margin-top: 150px;
 border: 1px solid #e3f1fe;
	}

	ul li{
 list-style: none;
 background: url(icones/erro.png) no-repeat left center;
 padding: 0 0 0 40px;
	}

	li {
 padding: 32px;
	}

Precisa utilizar um display:block no seu li, ficando assim:

ul {

 margin-top: 150px;
 border: 1px solid #e3f1fe;
 list-style-type: none;
 }

 ul li{
 display: block;
 height: [ defina uma altura ]; /* <== Defina uma altura para seu <li> */
 line-height: [ defina o mesmo valor da altura ]; /* <== Coloque aqui a mesma medida utilizada no height */
 background: url(icones/erro.png) no-repeat left; /* <== Removi o center pois por padrão ele centraliza quando não declarado */
 padding: 0 0 0 40px;
 }Aqui ainda seria talvez necessário utilizar um **width** no seu **li**, mas isso vai depender de outros detalhes, que pelo menos por enquanto não vêm ao caso... [http://forum.imasters.com.br/public/style_emoticons/](http://forum.imasters.com.br/public/style_emoticons/)default/joia.gif 

Caso não queira utilizar o display:block, pode tentar usar o display:inline-block, mas tenha cuidado caso ainda esteja se preocupando com browsers mais antigos, como o IE6, e ainda também o IE7, que às vezes esse display se comporta de maneira não-prevista... http://forum.imasters.com.br/public/style_emoticons/default/assobiando.gif

Teste aí amigo e nos comunique o(s) resultado(s).

Abraço!

perfeito Paulo.

Agora eu gostaria de centralizar isso tudo, como eu faço ?

Coloca margin: 0 auto no ul. O ul deve estar com width declarado.

http://forum.imasters.com.br/public/style_emoticons/default/thumbsup.gif

mesma coisa !

Como está o CSS do ul?

http://forum.imasters.com.br/public/style_emoticons/default/thumbsup.gif

ul {

 margin: 0 auto;

 margin-top: 150px;

 border: 1px solid #e3f1fe;

 list-style-type: none;

 }

 

 ul li{

 display: block;

 height: 60px; /* <== Defina uma altura para seu <li> */

 line-height: 60px; /* <== Coloque aqui a mesma medida utilizada no height */

 background: url(icones/erro.png) no-repeat left; /* <== Removi o center pois por padrão ele centraliza quando não declarado */

 padding: 0 0 0 40px;

 }

>
Coloca margin: 0 auto no ul. O ul deve estar com width declarado.

http://forum.imasters.com.br/public/style_emoticons/default/thumbsup.gif

http://forum.imasters.com.br/public/style_emoticons/default/thumbsup.gif

tem como fazer com que a imagem fique centralizada junto com o texto ?

Modo que estou fazendo é na mao e dependendo do texto nao vai ficar centralizado .

Não estou entendendo nada... =X

http://forum.imasters.com.br/public/style_emoticons/default/thumbsup.gif