Ir para conteúdo
Fórum Script Brasil
  • 0

alguém consegue centralizar esse site?


vini_loock

Pergunta

Bom dia pessoal eu tenho que finalizar um projeto, só falta centralizar.

alguém tem a solução, não precisa ser css, porque eu acho que já tentei tudo no css.

<html>
<head>
<title></title>
<style type="text/css">
body{
background: #666666;
}

#global{
background: #ffffff;
width: 900px;
position: absolute;
left: 50%
margin: 0 0 0 -500px;
text-align: left;
}

#topo{
background: #00ccff;
width: 890px;
height: 130px;
float: left;
margin: 5 0 0 5;
}

#menu_topo{
background-color: #00ccff;
width: 890px;
height: 30px;
float: left;
margin: 5 0 0 5;
}

#navbar{
background-color: #00ccff;
width: 130px;
height: 700px;
float: left;
margin: 5 0 0 5;
}

#conteudo{
background-color: #00ccff;
width: 620px;
height: 700px;
float: left;
margin: 5 0 0 5;
}

#rodape{
background-color: #00ccff;
width: 890px;
height: 50px;
float: left;
margin: 5 5 5 5;
}

</style>
</head>
<body>

<div id="global">
    <div id="topo"></div>
    <div id="menu_topo"></div>
    <div id="navbar"></div>
    <div id="conteudo"></div>
    <div id="navbar"></div>
    <div id="rodape"></div>
</div>

</body>
</html>

Link para o comentário
Compartilhar em outros sites

5 respostass a esta questão

Posts Recomendados

  • 0

criei uma div pegando tudo e inseri um css dando 100% de altura e a largura necessária

depois usei o margin: 0 auto; para centralizar =)

pronto:

<html>
<head>
<title></title>
<style type="text/css">
body{
background: #666666;
}

#all{
    width: 900px;
    height: 100%;
    margin: 0 auto;
}

#global{
background: #ffffff;
width: 900px;
position: absolute;
left: 50%
margin: 0 0 0 -500px;
text-align: left;
}

#topo{
background: #00ccff;
width: 890px;
height: 130px;
float: left;
margin: 5 0 0 5;
}

#menu_topo{
background-color: #00ccff;
width: 890px;
height: 30px;
float: left;
margin: 5 0 0 5;
}

#navbar{
background-color: #00ccff;
width: 130px;
height: 700px;
float: left;
margin: 5 0 0 5;
}

#conteudo{
background-color: #00ccff;
width: 620px;
height: 700px;
float: left;
margin: 5 0 0 5;
}

#rodape{
background-color: #00ccff;
width: 890px;
height: 50px;
float: left;
margin: 5 5 5 5;
}

</style>
</head>
<body>
<div id="all">
<div id="global">
    <div id="topo"></div>
    <div id="menu_topo"></div>
    <div id="navbar"></div>
    <div id="conteudo"></div>
    <div id="navbar"></div>
    <div id="rodape"></div>
</div>
</div>
</body>
</html>

Link para o comentário
Compartilhar em outros sites

  • 0

testei aqui no no FF e funcionou de boa.. testa ae

<script language="javascript" type="text/javascript">
<!--
window.onload = function(){
    div = 900;
    tamanho = window.outerWidth;
    sobra = tamanho - div;
    margin = sobra/2;
    document.getElementById('global').style.left = margin;
}
-->
</script>

----- edited -----

putz... de acordo o w3schools só funciona no FF

http://www.w3schools.com/jsref/obj_window.asp

Link para o comentário
Compartilhar em outros sites

  • 0

Thelon.

Eu já tinha feito assim, nem precisaria criar essa nova div, seria apenas eu trocar o:

position: absolute;
left: 50%
margin: 0 0 0 -500px;
por:
height: 900px;
margin: 0auto;

Mas o problema é que eu queria centralizar sem definir uma altura padão, porque vai ter várias páginas que vão abrir na div conteudo, e tem algumas páginas que tem pouco conteudo, dai ficaria estranho eu deixar uma página com 2000px de altura com um texto de 20 linhas.

E... fercosmig.

Não funcionou no ie, então não resolve muito, porque acho eu que a maioria das pessoas usam o ie, por ele já vir instalado no windows.

Se alguém tiver a slução posta ai.

Vlw

Link para o comentário
Compartilhar em outros sites

  • 0

Vini_loock, é como o Thelon disse, crie uma div geral e englobe tudo, com position absolute coloque 50% de distância da esquerda, e margin-left sendo a metade do width da div.

Assim:

position:absolute;
left:50%;
width:960px;
margin-left:-480px;

Asim funciona de certeza.

Vlw

Matheus Matos

Link para o comentário
Compartilhar em outros sites

Participe da discussão

Você pode postar agora e se registrar depois. Se você já tem uma conta, acesse agora para postar com sua conta.

Visitante
Responder esta pergunta...

×   Você colou conteúdo com formatação.   Remover formatação

  Apenas 75 emoticons são permitidos.

×   Seu link foi incorporado automaticamente.   Exibir como um link em vez disso

×   Seu conteúdo anterior foi restaurado.   Limpar Editor

×   Você não pode colar imagens diretamente. Carregar ou inserir imagens do URL.



  • Estatísticas dos Fóruns

    • Tópicos
      152,3k
    • Posts
      652,3k
×
×
  • Criar Novo...