[Resolvido] Alinhamento de botão

[Mr_Lucas 0]

Galera, estou iniciando no ramo de programação e estou com um probleminha aqui...

Estou fazendo um site (so por experiencia mesmo e para aprender melhor o uso de HTML+CSS) e quando estou tentando fazer um botao, colocando no background uma imagem não consigo alinhar a palavra "home" (que é o nome do botão) no lugar que eu quero, qual a propriedade que eu tenho q usar para fazer isso??

Eu usei o seguinte codigo HTML:

 

<div id="menu">
<ul class="menu">
<li class="home"><a href="#" >Home</a></li>
<li class="account">><a href="#">My account</a></li>
<li class="ajuda">><a href="#">Ajuda</a></li>
<li class="contacto">><a href="#">Contato</a></li>
</ul>
</div>

 

Depois no css coloquei um background...

[Lucas Guima 164]

Se for oq eu estou pensando, use padding, compensando com a altura ou line-height.

[GabrielFerrari 41]

Crie tópicos com títulos relacionados a sua dúvida!

Assim ajuda as pessoas que podem responder e a ter uma resposta mais rápida.

 

Sem contar que tal atitude é fora das regras do fórum

 

09ª Regra

 

É proibido a abertura de tópicos com título: "ME AJUDE", "PELO AMOR DE DEUS", "ESTOU DESESPERADO", "URGENTE", "SOCORRO", "HELP", "PEDIDO", "IMPLORO", "PLEASE", "DUVIDA", ou qualquer coisa similar, assim como utilizar Caixa Alta (letras todas em maiúsculas) no titulo ou mesmo no corpo do tópico ou post. Utilize títulos curtos e claros, que condizem com sua dúvida. Os títulos, tópicos e posts serão editados e os membros advertidos por MP.

Para saber mais Click Aqui

 

Quanto a dúvida:

 

Tente assim

<div id="menu">
<ul class="menu">
<li class="home"> <a href="#" >Home</a></li>
<li class="account">><a href="#">My account</a></li>
<li class="ajuda">><a href="#">Ajuda</a></li>
<li class="contacto">><a href="#">Contato</a></li>
</ul>
</div>

 

Obs: Não coloquei tag code pois o   iria sumir :(

Pelo que entendi você quer alinhar o Home com o começo das outras palavras certo ?

É mais fácil fazer assim

 

Porém se quiser utilizar CSS pode usar padding-left como foi dito pelo Lucas Guima

 

<div id="menu">
<ul class="menu">
<li class="home"><a href="#" style="padding-left:10px;" >Home</a></li>
<li class="account">><a href="#">My account</a></li>
<li class="ajuda">><a href="#">Ajuda</a></li>
<li class="contacto">><a href="#">Contato</a></li>
</ul>
</div>

Obs: Eu coloquei 10px mas tem que ver qual a distancia em px que vai ser necessária

Basta ir alterando até chegar no resultado esperado!

[Mr_Lucas 0]

valeu pessoal, ja consegui.

Enquanto ao alerta valeu tbm eu não sabia dessa regra... obrigadão...

Valeu

Abraço

 

Eu sou novo no forum

[GabrielFerrari 41]

Esquenta com isso não :)

No começo é meio complicado mas com o tempo você acostuma basta seguir as regras.

 

Se precisar de algo torne a postar ;)