[Resolvido] Não consigo posicionar um link

[the chuck norris 0]

Olá, estou começando a mexer com css, não é difícil, porém estou com um probleminha, eu crio uma classe para fazer a estilização de um link, mas não consigo atribuir o comando margin-top; eu só consigo com o margin-left; Este atributo não funciona com o link? Tem algum outro que posso usar para posicionar o link onde eu desejar?

[Giovani 104]

Será preciso ver o seu código, tem um link pro pessoal visualizar?

[Vinicius Ianni 189]

Veja se o site do maujor não lhe ajuda.

[GabrielFerrari 41]

Como o Giovani disse, é complicado te ajudar sem ver como está sendo feito,

é um caso que depende de outros elementos da página.

 

Já tentou usar padding-top para testar?

Acredito que tenha alguma coisa impedindo seu texto de receber essa propriedade.

 

se poder postar o link seria melhor ainda :thumbsup:

[the chuck norris 0]

Como o Giovani disse, é complicado te ajudar sem ver como está sendo feito,

é um caso que depende de outros elementos da página.

 

Já tentou usar padding-top para testar?

Acredito que tenha alguma coisa impedindo seu texto de receber essa propriedade.

 

se poder postar o link seria melhor ainda :thumbsup:

 

 

O padding não deu certo. Segue meu código abaixo:

 

body { 

background-color: #fff; 


}


#header  {

margin-top: -20px;
margin-left: -70px;
background: url("imoveis/img/header.png"); 
width: 1918px;
height: 298px;       


}


#logo { 

margin-top: -292px;
margin-left: 485px;
width: 113px;
height: 113px;
background: url("imoveis/img/logo.png") no-repeat;


}


#textblack {

margin-top: -90px;
margin-left: 760px;
color: #000;
font-size: 17px;
font-weight: bold;

}


#textred {

margin-top: 5px;
margin-left: 735px;
color: #CD0000;
font-size: 24px;
font-weight: bold;

}

#textblack2 {

margin-top: -60px;
margin-left: 975px;
color: #000;
font-size: 17px;
font-weight: bold;

}


#textred2 {

margin-top: 0px;
margin-left: 975px;
color: #CD0000;
font-size: 22px;
font-weight: bold;
width: 100px;

}

#separador { 

margin-left: 875px;
margin-top: -48px;
background: url("imoveis/img/separador_atendimento_topo.png");
width: 5px;
height: 94px;

}

#telefone {

margin-left: 900px;
margin-top: -100px;
background: url("imoveis/img/tel.png");
width: 60px;
height: 62px;

}

#chat {

margin-left: 1120px;
margin-top: -55px;
background: url("imoveis/img/chat_online.png");
width: 171px;
height: 117px;

}

#lupa {

margin-left: 470px;
margin-top: 5px;
background: url("imoveis/img/lupa_busca.png") no-repeat;
width: 150px;
height: 28px;

}

#textbusca {

margin-left: 505px;
margin-top: -24px;
color: #fff;
font-size: 20px;
width: 150px;
height: 100px;


} 

#apresenta  {

margin-top: 48px;
margin-left: -70px;
background: url("imoveis/img/bg_slide.png"); 
width: 1920px;
height: 399px;       


}


#menu			{

margin-top: 50px;
margin-left: 360px;

}

#menu li{
display: inline;
}

#menu li a {
background:url("imoveis/img/tabs_a_hover.png") repeat scroll 0 0 transparent;
color:white;
float:left;
font-size:14px;
height:30px;
padding-top:9px;
text-decoration:none;
}

#menu .botao{
background-position: -1px -38px;
color: #000;
width: 119px;
height: 29px;
padding-left:28px;
}
#menu .botao:hover{
background-position: 0px 0px;
color: #fff;


}


#fundo {

margin-top: 88px;
margin-left: 380px;
background: url("imoveis/img/fundo.png");
width: 719px;
height: 690px;

}



.btvejamais  {
position:absolute;
top:1395px;
left: 940px;
margin:0px;
padding:0px;

}


.btvejamais a {  
font: bold 15px/24px arial, helvetica, sans-aerif;	
padding:0px;
text-decoration: none; 
text-align: center;
color:#fff;
background: url('imoveis/img/bt_veja_mais.png')
no-repeat center center;	
width: 147px;  
height: 51px;	
display:block;	
}

#sidebar {
margin-top: -725px;
margin-left: 1110px;
background: url("imoveis/img/sidebar.png");
width: 240px;
height: 870px;



}


#menusidebar {

margin-top: -860px;
margin-left: 1080px;

}

#menusidebar li{
display: inline;

}

#menusidebar li a {
background:url("imoveis/img/botao.png") repeat scroll 0 0 transparent;
color:white;
float:left;
font-size:15px;
height:30px;
padding-top:9px;
text-decoration:none;
}

#menusidebar .btsidebar{
background-position: -1px 0px;
color: #363636;
width: 195px;
height: 74px;
padding-left:28px;
text-shadow: 1px 1px 0px #aaa;

}
#menusidebar .btsidebar:hover{
background-position: -1px -83px;


}


#spritemenu			{

margin-top: -890px;
margin-left: 1098px;
list-style: none;
position: absolute;

}

#spritemenuli{
display: inline;
}

#spritemenu li a {
background:url("imoveis/img/botao_sprite.png") repeat scroll 0 0 transparent;
color:white;
float:left;
font-size:14px;
height:30px;
padding-top:9px;
text-decoration:none;

}

#spritemenu .quemsomos{
background-position: 0px 0px;
color: #000;
width: 60px;
height: 70px;
padding-left:28px;
}


#banner {

margin-top: 735px;
margin-left: 380px;
background: url("imoveis/img/banner.png");
width: 720px;
height: 157px;

}


#rodape  {

margin-top: 20px;
margin-left: -70px;
margin-bottom: -10px;
background: url("imoveis/img/rodape.png"); 
width: 1920px;
height: 171px;       


}


#rodape .link {

margin-top: 50px;
margin-left: 500px;
color: #000;
font-size: 15px;

}


#logorodape { 

margin-top: -140px;
margin-left: 485px;
width: 126px;
height: 126px;
background: url("imoveis/img/logo_rodape.png") no-repeat;


}



#twitter { 
position: absolute;
margin-top: -70px;
margin-left: 800px;
background: url("imoveis/img/twi.png") no-repeat;
width: 200px;
height: 58px;


}

#twitter .follow {
margin-top: 20px;
margin-left: -70px;
color: #000;
font-size: 12px;

}

#facebook {

margin-top: -68px;
margin-left: 890px;
background: url("imoveis/img/face.png");
width: 60px;
height: 58px;

}

[Diéssica 140]

Qual é o seletor desse link?

 

Não sei qual o seletor que tu colocou padding.. Então, se determinou padding-top, aplica um padding de 10px em todos os lados e vê o que acontece:

padding:10px;

Diz o resultado :thumbsup:

[the chuck norris 0]

Eu tentei assim:

#rodape .link {

padding-top: 10px;
margin-left: 500px;
color: #000;
padding:10px;
font-size: 15px;

}

 

Tá certo? Mas mesmo assim não adiantou, em vez de alterar a altura altera o espaço a esquerda.

[GabrielFerrari 41]

cara o seu link está dentro de uma (provavelmente) div certo??

Ela tem espaço para aceitar +50 de altura?

 

Como está o seu HTML?

[the chuck norris 0]

cara o seu link está dentro de uma (provavelmente) div certo??

Ela tem espaço para aceitar +50 de altura?

 

Como está o seu HTML?

 

 

Minha div é esta:

#rodape  {

margin-top: 20px;
margin-left: -70px;
margin-bottom: -10px;
background: url("imoveis/img/rodape.png"); 
width: 1920px;
height: 171px;       


}


#rodape .link {

padding-top: 10px;
margin-left: 500px;
color: #000;
padding:10px;
font-size: 15px;

}

 

E o html está assim:

<div id="rodape"> 
<a class="link" href="#"> Home </a> 
</div>

[Diéssica 140]

A margem precisa ser necessariamente no link?

[the chuck norris 0]

Sim, pois eu quero encaixar ele em uma imagem. Tipo fazer aqueles menus de home contato etc.

[Evandro Oliveira 331]

margin e padding superior e inferior não se aplicam a elementos de linha.

 

adicione um

display: inline-block;

aos links.

[the chuck norris 0]

Deu certo! Muito Obrigado Evandro!