Ir para conteúdo

POWERED BY:

Arquivado

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

pinoc

Centralizar div

Por , em Javascript

Recommended Posts

pinoc    2

pinoc
Postado

Boa tarde.

 

Estou procurando uma solução para meu problema porem não achei nada util ainda.

Estou desenvolvendo um site que preciso colocar uma div centralizada na vertical, horizontal nem importa muito pois a div pega 100%.

Sem fazer isso sem problema algum com css porem para fazer com css preciso setar um height padrão na div para poder diminuir no margin-top depois.

 

Quero fazer a centralização por jquery fazendo o jquery pegar o tamanho que a div esta e adpitando ela no centro.

Alguem pode me ajudar pois so pessimo em jquery hehe.

 

Obrigado.

Compartilhar este post

Link para o post
Compartilhar em outros sites

lezão    0

lezão
Postado

Ola PINOC, bom dia!

no eu entendi tente isso

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 
Transitional//EN">
<html>
<head>
<title>Centrar uma  página com CSS</title>
<meta http-equiv="Content-Type" content="text/html; 
charset=iso-8859-1">

<style type="text/css">
body {
margin:0;
padding:0;
background:#cccccc;
text-align:center; /* hack para o IE */	
	}
#tudo {
width: 760px;
margin:0 auto;			
padding: 0px;
text-align:left; /* "remédio" para o hack do IE */	
	}
#conteudo {
padding: 0px;
background-color: #eeeeee;
	}
</style>
</head>
<body>
<div id="tudo">
<div id="conteudo">
    <h1>Pagina Centrada com CSS sem scroll ate 800x600</h1>
    <p> Não use nenhum elemento HTML 
(figuras, tabelas, etc...) com largura 
      superior a 750px.</p>
</div>
</div>
</body>
</html>

espero ter ajudado?????

Compartilhar este post

Link para o post
Compartilhar em outros sites

pinoc    2

pinoc
Postado

Lezão.

 

Cara oque preciso e centralizar na VERTICAL na horizontal não tem nescesidade pois a div ficara em 100%.

 

Obrigado pela ajuda até agora.

Compartilhar este post

Link para o post
Compartilhar em outros sites

Tadeu Barbosa    18

Tadeu Barbosa
Postado 
<div id="container">
    
    <div id="centralizado"> lorem ipsum </div>
    
</div>

<style>
#container {
    height: 300px;
    position: relative;
    background: #df4;
}

#centralizado {
    width: 80%;
    position: absolute;
    left:0; right:0;
    margin: auto;
    padding: 20px;
    background: #51d;
}
</style>

<script>
$(function(){

    $('#centralizado').css('top', ($('#container').outerHeight() - $('#centralizado').outerHeight()) / 2);


});
</script>

JsFiddle: http://jsfiddle.net/hN9d6/

Compartilhar este post

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

Informação importante

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

  Aceito