Centralizar Pagina em navegadores e monitores

invict · Janeiro 10, 2011

Olá amigos, bem estou com um problema que esta me deixando com serios problemas aqui na empresa, um site do cliente não quer centralizar de jeito algum nos navegadores nem monitores destintos como notebook e LCD de diferente tamanhos.

Vou postar o codigo da "index.asp" vejam o que podem ajudar este mal acabado.

<!--#include file="../Connections/LesteMinas.asp"-->
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<!--3 é a enquete-->
<meta http-equiv="content-type" content="text/html;charset=ISO-8859-1">
<style type="text/css">
<!--
#Layer1 {
position:absolute;
width:200px;
height:115px;
z-index:1;
left: 232px;
top: 156px;
}
#Layer2 {
position:absolute;
width:200px;
height:115px;
z-index:2;
left: 276px;
top: 788px;
}
#Layer3 {
position:absolute;
width:200px;
height:115px;
z-index:3;
left: 797px;
top: 612px;
}
#Layer4 {
position:absolute;
width:200px;
height:115px;
z-index:4;
left: 779px;
top: 163px;
}
#Layer5 {
position:absolute;
width:200px;
height:115px;
z-index:5;
left: 54px;
top: 536px;
}
#Layer6 {
position:absolute;
width:200px;
height:115px;
z-index:6;
left: -311px;
top: -1px;
}
#Layer7 {
position:absolute;
width:72px;
height:32px;
z-index:7;
}
#Layer8 {
position:absolute;
width:228px;
height:115px;
z-index:1;
left: -325px;
top: 276px;
}
#Layer9 {
position:absolute;
width:200px;
height:115px;
z-index:7;
left: 148px;
top: 821px;
}
#Layer10 {
position:absolute;
width:599px;
height:115px;
z-index:8;
left: 203px;
top: 36px;
}
#Carro {
position:absolute;
width:315px;
height:19px;
z-index:8;
left: -315px;
top: 551px;
}
#Layer12 {
position:absolute;
width:200px;
height:115px;
z-index:8;
left: 704px;
top: 834px;
}
#Layer13 {
position:absolute;
width:200px;
height:115px;
z-index:9;
left: 306px;
top: 814px;
}
#Law {
position:absolute;
width:200px;
height:200px;
z-index:9;
left: 700px;
top: 536px;
}
#Layer15 {
position:absolute;
width:200px;
height:115px;
z-index:10;
left: 59px;
top: 815px;
}
#Layer16 {
position:absolute;
width:200px;
height:115px;
z-index:11;
left: 395px;
top: -710px;
}
#Layer17 {
position:absolute;
width:200px;
height:23px;
z-index:11;
left: -1px;
top: 439px;
}
#Layer18 {
position:absolute;
width:200px;
height:115px;
z-index:11;
left: 1px;
top: 105px;
}
#Layer19 {
position:absolute;
width:5px;
height:25px;
z-index:11;
left: 10px;
top: 382px;
}
-->
</style>
<!--INICIO DIV PAI CENTRALIZA TUDO -->
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>NotíciasUai</title>
<link href="style/style.css" rel="stylesheet" type="text/css" />
<link href="style/stylemnu.css" rel="stylesheet" type="text/css" />
<link rel="stylesheet" type="text/css" href="includes01/jquery/lightbox/css/lightbox.css" media="screen" />
<script src="Scripts/AC_RunActiveContent.js" type="text/javascript"></script>
<script  language="text/javascript" src="includes01/jquery/jquery-1.3.2.min.js"></script>
<script  language="text/javascript" src="includes01/jquery/lightbox/jquery.lightbox.js"></script>
<script  language="text/javascript" src="validajs/valida.js"></script>
<script  language="text/javascript" />
$(document).ready(function(){
$('li.utili').click(function(){
	$(this).parent().find('ul.submenu').slideToggle("normal");
});
});
</script>

</head>
<style type="text/css">
div#loterias ul {
list-style-image:url(img/botao_loterias.jpg);
padding-left:30px;
}
ul.submenu{ 
display: none; 
}
</style>

<body>
<div id="Layer12">
<!--#include file="enquete.asp"--></div>
<!--FIM DA DIV TOPO/-->
<div id="cont_geral">
<div id="conteudo">

<div id="coluna_1">

<div id="menu">
   <div id="menuitens">
	  <p><a href="HTTP://WWW.NOTICIASUAI.COM.BR"><img src="http://www.noticiasuai.com.br/novosite/logo.png" width="191" height="94" border="0" longdesc="http://www.noticiasuai.com.br" /></a></p>
	  <ul class="menu"><li><a href="index.asp"><span>Capa</span> </a></li>
	    <li><a href="CanaisNoticias.asp?id_categoria_noticia=25"><span>Polícia</span></a></li>
	    <li><a href="CanaisNoticias.asp?id_categoria_noticia=24"><span>Política</span></a></li>
	    <li><a href="CanaisNoticias.asp?id_categoria_noticia=36"><span>Geral</span></a></li>
	    <li><a href="UltimasNoticias.asp?id_categoria_noticia=12"><span>Ultimas Notícias</span></a></li>
	    <li><a href="CanaisNoticias.asp?id_categoria_noticia=26"><span>Região</span></a></li>
	    <li class="utili"><a href="CanaisNoticias.asp?id_categoria_noticia=27"><span>Cidade</span></a></li>
	    <ul class="submenu">
	      <li>
	        <a href="CanaisNoticias.asp?id_categoria_noticia=28">
            <span>Denúncias</span>						</a>					</li>
           </ul>
		<li><a href="Galerias.asp?id_categoria_noticia=30"><span>Galerias de Fotos</span></a></li>
	    <li><a href="Colunistas.asp"><span>Colunistas</span></a></li>
	    <li><script language="JavaScript">
function abrir(URL) {

 var width = 500;
 var height = 250;

 var left = 99;
 var top = 99;

 window.open(URL,'janela', 'width='+width+', height='+height+', top='+top+', left='+left+', scrollbars=no, status=no, toolbar=no, location=no, directories=no, menubar=no, resizable=no, fullscreen=no');

}
</script>

<a href="javascript:abrir('../includes/MenuPrincipalContato.asp');"><span>Contato</span></a></li>
    </ul>
   </div>
</div><!--FIM DA DIV MENU/-->

<div id="twitterban"></div>

<!--FIM DA DIV PROGRAMAS_BANEERS/-->
</div><!--FIM DA DIV CONT_1/-->

 </p>
 <div id="Layer19"><a href="../includes/MenuPrincipalContato.asp"><img src="http://minascap.com/loja/livezilla/images/atendimento_online.jpg" width="169" height="89" border="0" /></a></div>
 <div id="Layer11"><!--#include file="../FullBanner.asp"-->
<!--FIM DA DIV INFO/-->

  <br><br><div id="not_destaque"><a href="#" class="link_1"><img src="img/cartola_noticiaemdestaque.gif" class="h1" border="0" /></a>
<div id="info"> <br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br>
<a href="#" class="link_1" />  
     <span class="not_destaque_titulo">

 <div id="Layer1">
 <div id="foto">  
  <!--#include file="../Includes/MenuDestaque.asp"-->
		  <!--#include file="../Slide_Show1.asp"--> 			  
   </div>
</div>
</div>


</div>

<div id="Layer5">
   <div id="foto">
		 <!--#include file="../Includes/1.asp"-->
   </div>
</div>
<br><br><br><br><br><br><br><br><br><br>
<div id="Layer15"> 
<div id="fotogaleria">
<!--#include file="../Includes/4.asp"--> </div></div>

<!--FIM DA DIV FOTO/-->



   <div id="Law">
<div id="foto">
<!--#include file="../Includes/3.asp"--></div>

 <div id="Layer6">
 <div id="fotogaleria">
 <!--#include file="../Includes/2.asp"--></div>
   <br><br><br><br><br><br><br><br>


</div>
<!--FIM DA DIV CONT_CAPA/-->    
<div id="Layer8">
   <div id="foto">
<a href="#" class="link_1" />
   <!--#include file="../Includes/galeria.asp"--></div>

<div id="Layer16">
 	    <!--#include file="../Includes/UltimaHora.asp"--></div>




</div>
<div id="Carro"> 
 <div align="center">2010 - 2007 / Todos os direitos reservados. www.noticiasuai.com.br </div>
</div>
</body>
</html>


<p>

<br />


<!--FIM DA DIV ESTUDIO/-->

 <tr>
   <td height="20" colspan="2" bgcolor="#FFFFFF"></td>
 </tr>
</table>
</div><!--FIM DA DIV NO AR/-->



</div><!--FIM DA DIV ENQUETE_INTERNA/-->
</div><!--FIM DA DIV ENQUETE/-->
</div>
<!--BARRA SUPERIOR --><!--FIM DIV PAI CENTRALIZA TUDO -->
</div>
</body>
</html>

saloeric · Janeiro 10, 2011

isso tem a ver com o css, para ficar centralizado, tem que na div (<div id="cont_geral"> , penso que seja essa) que engloba tudo por,


margin:0 auto;

Vinicius Ianni · Janeiro 10, 2011

Um bom site para referencias em css é o www.maujor.com sempre visito ele quando estou com alguma duvida.

Existem scripts que detectam a resolução do navegador e direcionam para a pagina formatada para essa resolução.

Posso transferir seu tópico para a area de css onde terá mais ajuda para seu caso.

invict · Janeiro 10, 2011

Caro vinicius, faça a transferencia sim! O problema q em certos monitores ele sai todo desalinhado

William Bruno · Janeiro 10, 2011

minha dica é: pare de usar o Dreamweaver no modo visual.

não use position: absolute dessa forma.

se você não quiser estudar HTML/CSS corretamente, posso te transferir para o fórum de DW, lá eles podem te ajudar com o editor.

fabiosc80 · Janeiro 10, 2011

Isso acontece por que você esta definindo tudo como:

position:absolute;

e ta definindo um certo numero de pixels para essa "position".

Usa relativo.

invict · Janeiro 10, 2011

Hum, quero sim cara! Vou tirar esse position e testar! Obrigado!

Então cara tiro mas coloco o q? Tu tem algum modelo ai para me mostrar?

Certo eu coloco "relative" e tiro as numeraçoes?

Matheus Brito · Janeiro 10, 2011

A forma mais fácil é você ir trabalhando usando o tamanho fixo e em porcentagem.Pesquise no maujor.

Abs

Evandro Oliveira · Janeiro 11, 2011

http://forum.imasters.com.br/index.php?/topic/419368-css-mudancas-de-posicoes-com-novos-conteudos/

Arquivado

Centralizar Pagina em navegadores e monitores

Recommended Posts

invict 0

Compartilhar este post

Link para o post

Compartilhar em outros sites

saloeric 1

Compartilhar este post

Link para o post

Compartilhar em outros sites

Vinicius Ianni 189

Compartilhar este post

Link para o post

Compartilhar em outros sites

invict 0

Compartilhar este post

Link para o post

Compartilhar em outros sites

William Bruno 1501

Compartilhar este post

Link para o post

Compartilhar em outros sites

fabiosc80 0

Compartilhar este post

Link para o post

Compartilhar em outros sites

invict 0

Compartilhar este post

Link para o post

Compartilhar em outros sites

Matheus Brito 12

Compartilhar este post

Link para o post

Compartilhar em outros sites

Evandro Oliveira 331

Compartilhar este post

Link para o post

Compartilhar em outros sites

problema em usar json para realizar engenharia de dados

Soma dos dias utilizados

Saber se todos os produtos de uma consulta estão cadastrados no banco de dados

Fóruns

Tempo Real

Informação importante