[Resolvido] Links Horizontais CSS

[Sasdelli Informática 0]

E ai pessoal,

 

boa tarde..

 

Gostaria de saber se no css tem como determinar que os links fiquem lado a lado (horizontalmente)

 

por EX:

 

dentro da div tenho assim:

 

  <div id="teste"/>
        <a>LINK1</a>
        <a>LINK2</a>
        <a>LINK3</a>
  </div>

 

gostaria que eles fossem exibidos assim:

 

LINK1 LINK2 LINK3

 

 

ao invés de um embaixo do outro..

 

alguem pode me ajudar?

 

Valew galera...

[Eliseu M. 2]

Ãh? Você já testou isso? No código acima eles ficam lado a lado, a não ser que alguém tenha definido display:block; nos links. Mas, se você quiser fazer isso com listas UL, veja:

 

<style>
#menu {
list-style:none;
margin-left:-37px;
}

#menu li {
display:inline;
}
</style>
<ul id=menu>
<li><a href=#>Link</a></li>
<li><a href=#>Link</a></li>
<li><a href=#>Link</a></li>
</ul>

[Sasdelli Informática 0]

Ãh? Você já testou isso? No código acima eles ficam lado a lado, a não ser que alguém tenha definido display:block; nos links. Mas, se você quiser fazer isso com listas UL, veja:

 

<style>
#menu {
list-style:none;
margin-left:-37px;
}

#menu li {
display:inline;
}
</style>
<ul id=menu>
<li><a href=#>Link</a></li>
<li><a href=#>Link</a></li>
<li><a href=#>Link</a></li>
</ul>

 

 

Caramba amigo, desculpe me expressei mal..

 

na verdade, eu sei que eles ficam lado a lado, porém gostaria que eles desse um espaçamento entre eles entende?

 

eu sei como fazer isso só que verticalmente, gostaria de saber se existe uma forma pra dar espaçamento nos links horizontalmente..

 

compreendeu melhor agora?

 

abraço!

[Eliseu M. 2]

Ahhhhhh sim, é só usar margin ou padding:

 

<style>
#menu {
       list-style:none;
       margin-left:-57px;
}

#menu li {
       display:inline;
       padding:4px 16px 4px 16px;
       margin-left:20px;
       background:#AAA;
}
</style>
<ul id=menu>
       <li><a href=#>Link</a></li>
       <li><a href=#>Link</a></li>
       <li><a href=#>Link</a></li>
</ul>

[Sasdelli Informática 0]

Ahhhhhh sim, é só usar margin ou padding:

 

<style>
#menu {
       list-style:none;
       margin-left:-57px;
}

#menu li {
       display:inline;
       padding:4px 16px 4px 16px;
       margin-left:20px;
       background:#AAA;
}
</style>
<ul id=menu>
       <li><a href=#>Link</a></li>
       <li><a href=#>Link</a></li>
       <li><a href=#>Link</a></li>
</ul>

 

a beleza...

 

deu certo aqui...

 

obrigado!