Ir para conteúdo

POWERED BY:

Arquivado

Este tópico foi arquivado e está fechado para novas respostas.

avcintra

Espaçamento

Por , em Desenvolvimento frontend

Recommended Posts

avcintra    0

avcintra
Postado

Olá a todos, será que alguem pode me ajudar?

 

No html abaixo listei três tópicos de texto e no lugar da bolinha que apareçe normalmente troquei por uma imagem de uma risca, até ai tudo certo... só que eu não consigo dar um espaçamento entre a risca e o texto que vem depois, alguem sabe como?

 

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"><HTML><HEAD><TITLE> New Document </TITLE><style>.espacamento{margin: 10px 10px 20px 28px; font-family: arial; font-size:11px}ul {margin-left: 10px; margin-top: 10px; margin-bottom: 10px; }li.lk {margin-left:10px;margin-right:10px; list-style-image: url(imagens/risca.jpg); list-style-position: outside;}li.lk a:link, li.lk a:visited, li.lk a:active, li.lk a:hover {font-weight: bold; text-decoration: none;}li.lk a:hover {text-decoration: underline;}</style></HEAD><BODY><TABLE border="1" width="250">					<TR><TD class="bg-destaque1" height="205" valign="top"><div class="espacamento"><li class="lk">12 anos de experiência no desenvolvimento de soluções de tecnologia da informação nas mais diversas plataformas e ambientes.<p/></li><li class="lk">Os melhores profissionais do mercado sempre atualizados às novas tecnologias.<p/></li><li class="lk">As melhores metodologias, garantindo soluções rápidas, eficientes e econômicas.<p/></li></div></TD></TR></TABLE></BODY></HTML>

Compartilhar este post

Link para o post
Compartilhar em outros sites

pa_bruno    0

pa_bruno
Postado

cara, pq a utilização da tabela? naum entendi o fechamento da tag <p>, e ainda errada <p/> o fechamento certo é <p>, mas sendo q ela nem eh aberta... ;) e o espaçamento eh feito pelo padding do li:

li.lk {margin-left:10px;margin-right:10px; list-style-image: url(imagens/risca.jpg); list-style-position: outside; padding: 0 0 0 25px; }
ae você muda o 25px pelo valor correto... http://forum.imasters.com.br/public/style_emoticons/default/thumbsup.gif

Compartilhar este post

Link para o post
Compartilhar em outros sites

pa_bruno    0

pa_bruno
Postado

outra coisa, a tag <li> e filha do <ul>, <ol>... ela naum funciona orretamente se você naum usa-los... ;)

o certo eh:

<ul><li class="lk">12 anos de experiência no desenvolvimento de soluções de tecnologia da informação nas mais diversas plataformas e ambientes.</li><li class="lk">Os melhores profissionais do mercado sempre atualizados às novas tecnologias.</li><li class="lk">As melhores metodologias, garantindo soluções rápidas, eficientes e econômicas.</li></ul>

 

dah uma olhada nesse codigo... acho q tah bem melhor:

CSS:

body {	margin: 0;	padding: 0;}ul {	margin: 0 10px 10px 10px;	padding: 0;	list-style: none;}li.lk {	margin: 0 10px;	background: url(wink.gif) no-repeat;	font: 11px arial;	padding: 0 0 0 25px;}
HTML:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head><title>Teste</title></head><body>	<ul>		<li class="lk">12 anos de experiência no desenvolvimento de soluções de tecnologia da informação nas mais diversas plataformas e ambientes.</li>		<li class="lk">Os melhores profissionais do mercado sempre atualizados às novas tecnologias.</li>		<li class="lk">As melhores metodologias, garantindo soluções rápidas, eficientes e econômicas.</li>	</ul></body></html>
assim tah certinho... http://forum.imasters.com.br/public/style_emoticons/default/thumbsup.gif

Compartilhar este post

Link para o post
Compartilhar em outros sites
Ir para a lista de tópicos Desenvolvimento frontend
×

Informação importante

Ao usar o fórum, você concorda com nossos Termos e condições.

  Aceito