Foros del Web » Creando para Internet » Diseño web »

Como se Alinea al centro del navegador toda la pagina?

Estas en el tema de Como se Alinea al centro del navegador toda la pagina? en el foro de Diseño web en Foros del Web. Hola alguien me podria decir q codigo pongo en el index de mi sitio en html para q en el navegador siempre se visualice todo ...
  #1 (permalink)  
Antiguo 03/11/2008, 10:29
 
Fecha de Ingreso: enero-2005
Mensajes: 97
Antigüedad: 12 años, 10 meses
Puntos: 0
Como se Alinea al centro del navegador toda la pagina?

Hola alguien me podria decir q codigo pongo en el index de mi sitio en html para q en el navegador siempre se visualice todo el sitio en centro?
el sitio lo hice en publisher pero no encuentro el seteo para poner alineado el sitio en el centro...y sale a la izquierda siempre...

muchas gracias!!!!!!!
Daxe
  #2 (permalink)  
Antiguo 03/11/2008, 10:38
 
Fecha de Ingreso: octubre-2006
Ubicación: Murcia - España
Mensajes: 336
Antigüedad: 11 años, 1 mes
Puntos: 6
Respuesta: Como se Alinea al centro del navegador toda la pagina?

con css se puede utilizando style="margin:auto;"
  #3 (permalink)  
Antiguo 03/11/2008, 10:48
Avatar de gVenom  
Fecha de Ingreso: julio-2008
Ubicación: Costa Rica
Mensajes: 1.455
Antigüedad: 9 años, 5 meses
Puntos: 53
Respuesta: Como se Alinea al centro del navegador toda la pagina?

Cita:
Iniciado por Daxe Ver Mensaje
Hola alguien me podria decir q codigo pongo en el index de mi sitio en html para q en el navegador siempre se visualice todo el sitio en centro?
el sitio lo hice en publisher pero no encuentro el seteo para poner alineado el sitio en el centro...y sale a la izquierda siempre...

muchas gracias!!!!!!!
Daxe
Puedes encerrar todo el contenido en un div
Código HTML:
<div align="center">Tu contenido</div> 
o si usas tablas entonces:

Código HTML:
<table align="center"> 
-----suerte-----
__________________
"Al que venciere y guardare mis obras hasta el fin, yo le daré autoridad sobre las naciones."
Apocalipsis 2: 26
Servicios para Pymes http://dst.co.cr
  #4 (permalink)  
Antiguo 03/11/2008, 11:09
 
Fecha de Ingreso: enero-2005
Mensajes: 97
Antigüedad: 12 años, 10 meses
Puntos: 0
Respuesta: Como se Alinea al centro del navegador toda la pagina?

muchas gracias...lo probare en seguida...
  #5 (permalink)  
Antiguo 03/11/2008, 11:33
 
Fecha de Ingreso: enero-2005
Mensajes: 97
Antigüedad: 12 años, 10 meses
Puntos: 0
Respuesta: Como se Alinea al centro del navegador toda la pagina?

disculpa...ahi va mi codigo ...y mil disculpas pero me estoy volviendo loco...no se si lo estoy haciendo bien...si pueden ayudarme y decirme donde debo poner bien el codigo para q toda la pagina con sus secciones aparezca centrada, con espacios en blanco alos costados...la web tiene 1000 px de ancho... el sitio esta si quieren verlo en www.plenoperfil.com.ar (muchas gracias de nuevo!!!!!!!...)
daxe...




<html xmlns:v="urn:schemas-microsoft-com:vml"
xmlns:o="urn:schemas-microsoft-com:office:office"
xmlns:dt="uuid:C2F41010-65B3-11d1-A29F-00AA00C14882"
xmlns="http://www.w3.org/TR/REC-html40">

<head>
<meta http-equiv=Content-Type content="text/html; charset=windows-1252">
<link rel=File-List href="index_archivos/filelist.xml">
<!--[if !mso]>
<style>
v\:* {behavior:url(#default#VML);}
o\:* {behavior:url(#default#VML);}
b\:* {behavior:url(#default#VML);}
.shape {behavior:url(#default#VML);}
</style>
<![endif]-->
<title>Pleno Perfil - Estudios Grafológicos</title>
<style>
<!--
/* Definiciones de fuente */
@font-face
{font-family:Georgia;
panose-1:2 4 5 2 5 4 5 2 3 3;}
/* Definiciones de estilo */
p.MsoNormal, li.MsoNormal, div.MsoNormal
{text-indent:0pt;
margin-left:auto;
margin-right:auto;
margin-top:0pt;
margin-bottom:9.0pt;
line-height:113%;
text-align:center;
font-family:Georgia;
font-size:9.15pt;
color:#C2E166;}
ol
{margin-top:0in;
margin-bottom:0in;
margin-left:.25in;}
ul
{margin-top:0in;
margin-bottom:0in;
margin-left:.25in;}
@page
{size:8.2673in 11.6923in;}
-->
</style>
<!--[if gte mso 9]><xml>
<o:shapedefaults v:ext="edit" spidmax="3074" fill="f" fillcolor="white [7]"
strokecolor="#c2e166 [0]">
<v:fill color="white [7]" color2="white [7]" on="f"/>
<v:stroke color="#c2e166 [0]" color2="white [7]">
<o:left v:ext="view" color="#c2e166 [0]" color2="white [7]"/>
<o:top v:ext="view" color="#c2e166 [0]" color2="white [7]"/>
<o:right v:ext="view" color="#c2e166 [0]" color2="white [7]"/>
<o:bottom v:ext="view" color="#c2e166 [0]" color2="white [7]"/>
<o:column v:ext="view" color="#c2e166 [0]" color2="white [7]"/>
</v:stroke>
<v:shadow color="#ebf5cc [4]"/>
<v:textbox inset="2.88pt,2.88pt,2.88pt,2.88pt"/>
<o:colormru v:ext="edit" colors="#080808,#c2e166,#cce67f,#d7eb99,#e1f0b2,#e bf5cc,#030,#0c6"/>
</o:shapedefaults><o:shapelayout v:ext="edit">
<o:idmap v:ext="edit" data="1"/>
<o:regrouptable v:ext="edit">
<o:entry new="1" old="0"/>
</o:regrouptable>
</o:shapelayout></xml><![endif]-->
</head>

<body link="#0033CC" vlink="#6633CC" style='margin:0'>
<div align="center">
<!--[if gte vml 1]><v:rect id="_x0000_s1136" style='position:absolute;left:263.25pt;
top:45pt;width:225pt;height:255pt;z-index:58;mso-wrap-distance-left:2.88pt;
mso-wrap-distance-top:2.88pt;mso-wrap-distance-right:2.88pt;
mso-wrap-distance-bottom:2.88pt' o:preferrelative="t" filled="f" stroked="f"
insetpen="t" o:cliptowrap="t">
<v:stroke>
<o:left v:ext="view" color="#c2e166 [0]" color2="white [7]"/>
<o:top v:ext="view" color="#c2e166 [0]" color2="white [7]"/>
<o:right v:ext="view" color="#c2e166 [0]" color2="white [7]"/>
<o:bottom v:ext="view" color="#c2e166 [0]" color2="white [7]"/>
<o:column v:ext="view" color="#c2e166 [0]" color2="white [7]"/>
</v:stroke>
<v:imagedata src="index_archivos/image700.gif" o:title="logofin2"/>
<v:path o:extrusionok="f"/>
<o:lock v:ext="edit" aspectratio="t" cropping="t"/>
</v:rect><![endif]--><![if !vml]><span style='position:absolute;z-index:58;
left:351px;top:60px;width:300px;height:340px'><img width=300 height=340
src="index_archivos/image700.gif" v:shapes="_x0000_s1136"></span><![endif]><!--[if gte vml 1]><v:shapetype
id="_x0000_t202" coordsize="21600,21600" o:spt="202" path="m,l,21600r21600,l21600,xe">
<v:stroke joinstyle="miter"/>
<v:path gradientshapeok="t" o:connecttype="rect"/>
</v:shapetype><v:shape id="_x0000_s1137" type="#_x0000_t202" style='position:absolute;
left:338.25pt;top:312pt;width:75pt;height:27pt;z-index:59;
mso-wrap-distance-left:2.88pt;mso-wrap-distance-top:2.88pt;
mso-wrap-distance-right:2.88pt;mso-wrap-distance-bottom:2.88pt' filled="f"
fillcolor="white [7]" stroked="f" strokecolor="#c2e166 [0]" o:cliptowrap="t">
<v:fill color2="white [7]"/>
<v:stroke color2="white [7]">
<o:left v:ext="view" color="#c2e166 [0]" color2="white [7]"/>
<o:top v:ext="view" color="#c2e166 [0]" color2="white [7]"/>
<o:right v:ext="view" color="#c2e166 [0]" color2="white [7]"/>
<o:bottom v:ext="view" color="#c2e166 [0]" color2="white [7]"/>
<o:column v:ext="view" color="#c2e166 [0]" color2="white [7]"/>
</v:stroke>
<v:shadow color="#ebf5cc [4]"/>
<v:path insetpenok="f"/>
<v:textbox style='mso-column-margin:2mm' inset="2.88pt,2.88pt,2.88pt,2.88pt"/>
</v:shape><![endif]--><![if !vml]><span style='position:absolute;z-index:59;
left:451px;top:416px;width:100px;height:36px'>

<table cellpadding=0 cellspacing=0>
<tr>
<td width=100 height=36 style='vertical-align:top'><![endif]>
<div v:shape="_x0000_s1137" style='padding:2.88pt 2.88pt 2.88pt 2.88pt'
class=shape>
<p class=MsoNormal style='text-align:center;text-align:center'><span
style='font-size:9.0pt;line-height:113%;font-family:Georgia;font-weight:bold;
language:ES-MODERN'><a href="index_archivos/Page356.htm">ENTRAR</a></span></p>
</div>
<![if !vml]></td>
</tr>
</table>

</span><![endif]><!--[if gte vml 1]><v:group id="_x0000_s1141" style='position:absolute;
left:0;top:0;width:750pt;height:486pt;z-index:63' coordorigin="105422700,88239600"
coordsize="9525000,6172200">
<v:rect id="_x0000_s1142" style='position:absolute;left:114366109;top:882396 00;
width:581591;height:6172200;rotation:180;visibilit y:visible;
mso-wrap-edited:f;mso-wrap-distance-left:2.88pt;mso-wrap-distance-top:2.88pt;
mso-wrap-distance-right:2.88pt;mso-wrap-distance-bottom:2.88pt' fillcolor="white [7]"
stroked="f" strokecolor="#c2e166 [0]" o:cliptowrap="t">
<v:fill color2="#eff7d7 [4 lighten(204)]" rotate="t" angle="-90" type="gradient"/>
<v:stroke color2="white [7]">
<o:left v:ext="view" color="#c2e166 [0]" color2="white [7]" joinstyle="miter"/>
<o:top v:ext="view" color="#c2e166 [0]" color2="white [7]" joinstyle="miter"/>
<o:right v:ext="view" color="#c2e166 [0]" color2="white [7]" joinstyle="miter"/>
<o:bottom v:ext="view" color="#c2e166 [0]" color2="white [7]" joinstyle="miter"/>
<o:column v:ext="view" color="#c2e166 [0]" color2="white [7]"/>
</v:stroke>
<v:shadow color="#ebf5cc [4]"/>
<v:path insetpenok="f"/>
<o:lock v:ext="edit" shapetype="t"/>
<v:textbox inset="2.88pt,2.88pt,2.88pt,2.88pt"/>
</v:rect><v:rect id="_x0000_s1143" style='position:absolute;left:105422700;
top:88239600;width:581591;height:6172200;visibilit y:visible;
mso-wrap-edited:f;mso-wrap-distance-left:2.88pt;mso-wrap-distance-top:2.88pt;
mso-wrap-distance-right:2.88pt;mso-wrap-distance-bottom:2.88pt' fillcolor="white [7]"
stroked="f" strokecolor="#c2e166 [0]" o:cliptowrap="t">
<v:fill color2="#eff7d7 [4 lighten(204)]" rotate="t" angle="-90" type="gradient"/>
<v:stroke color2="white [7]">
<o:left v:ext="view" color="#c2e166 [0]" color2="white [7]"/>
<o:top v:ext="view" color="#c2e166 [0]" color2="white [7]"/>
<o:right v:ext="view" color="#c2e166 [0]" color2="white [7]"/>
<o:bottom v:ext="view" color="#c2e166 [0]" color2="white [7]"/>
<o:column v:ext="view" color="#c2e166 [0]" color2="white [7]"/>
</v:stroke>
<v:shadow color="#ebf5cc [4]"/>
<v:path insetpenok="f"/>
<o:lock v:ext="edit" shapetype="t"/>
<v:textbox inset="2.88pt,2.88pt,2.88pt,2.88pt"/>
</v:rect></v:group><![endif]--><![if !vml]><span style='position:absolute;
z-index:63;left:0px;top:0px;width:1000px;height:648p x'>
<div align="center">
<img width=1000 height=648 src="index.htm" v:shapes="_x0000_s1141 _x0000_s1142 _x0000_s1143" align="absmiddle"></div>
</span><![endif]>
</div>

</body>

</html>
  #6 (permalink)  
Antiguo 03/11/2008, 11:49
Avatar de Aresillo
Colaborador
 
Fecha de Ingreso: marzo-2008
Ubicación: Becerril de la Sierra
Mensajes: 958
Antigüedad: 9 años, 8 meses
Puntos: 53
Respuesta: Como se Alinea al centro del navegador toda la pagina?

Tienes un código que no sé ni por donde cogerlo! supongo que será la ignorancia propia...porque no sé porque tienes tanto código...

Aresillo!!
PD: Sigo mirando a ver si lo entiendo...
  #7 (permalink)  
Antiguo 03/11/2008, 11:59
Avatar de gVenom  
Fecha de Ingreso: julio-2008
Ubicación: Costa Rica
Mensajes: 1.455
Antigüedad: 9 años, 5 meses
Puntos: 53
Respuesta: Como se Alinea al centro del navegador toda la pagina?

Bueno, no estoy seguro de que falla le ves,porque en mi monitor a 1024x768 yo veo todo centrado, hasta donde llega mi monitor, lo que pasa es que como lo hiciste a 1000 de ancho, y todo el contenido esta a la izquierda, da la sensación de que no esta centrado pero en realidad parece que si lo esta.

Tienes que corregir un problema porque la pagina con el link "entrar" no esta funcionando en Firefox ( yo no pude pasar de ahí, tuve que abrirlo con IE)

Saludos
__________________
"Al que venciere y guardare mis obras hasta el fin, yo le daré autoridad sobre las naciones."
Apocalipsis 2: 26
Servicios para Pymes http://dst.co.cr
  #8 (permalink)  
Antiguo 03/11/2008, 12:11
 
Fecha de Ingreso: enero-2005
Mensajes: 97
Antigüedad: 12 años, 10 meses
Puntos: 0
Respuesta: Como se Alinea al centro del navegador toda la pagina?

gracias...el codigo es el q hace el publisher...si...tmb vi q es un choclo de codigo...nose por q tanto...luego lo abri al archivo (ya q el maldito publisher no permite editar el codigo fuente html) en Adobe goLive...ahi si puedo editar el codigo fuente...pero no se bien como ...si puedes ver donde estoy fayando...muchas gracias
daxe...
  #9 (permalink)  
Antiguo 03/11/2008, 12:14
 
Fecha de Ingreso: enero-2005
Mensajes: 97
Antigüedad: 12 años, 10 meses
Puntos: 0
Respuesta: Como se Alinea al centro del navegador toda la pagina?

GRACIAS a todos por las ayudas...yo mas q nada hago diseño...pero de proramacion de sitios se muy muy poco...lo del link tampoco se como hacerlo...soy un ignorante..!!! ojala tuviera tiempo pa aprender mas....deseo hacerlo!!!!
muchas gracias si alguien puede tirame una soga!!!
daxe
  #10 (permalink)  
Antiguo 03/11/2008, 13:07
Colaborador
 
Fecha de Ingreso: junio-2007
Mensajes: 5.798
Antigüedad: 10 años, 6 meses
Puntos: 538
Respuesta: Como se Alinea al centro del navegador toda la pagina?

Lo siento, pero me pasa como a Aresillo, tienes definidos estilos por todos los lados, en el head, en el body...
Así que voy a olvidarme de tu código y a repetir yo (una vez más, y ya he perdido la cuenta) la forma de centrar horizontalmente la página mediante css:

Tengamos un div que va a ser el contenedor de nuestra página, esto es, en él vamos a colocar TODO el contenido que queramos que se muestre centrado. Lo identificaremos como <div id="contenedor">
Le asignamos un identificador único (id) porque en esa página no habrá otro div con ese nombre.
En el css definimos las propiedades del mismo:
Cita:
#contenedor {margin: 0 auto;
width: 970px; /*es muy importante que tenga definida una anchura, (ya lo aprendí, Mik ;)*/
/*resto de las propiedades que quieras definir*/}
y en el html sólo tienes que incluir:
Cita:
</head>
<body>
div id="contenedor>
<!-- todo el contenido de la página -->
</body>
Sería conveniente que al inicio del .css lo resetees. (sólo tienes que buscar por ese término)

Creo que a partir de hoy haré un contador con las veces que se responde ésto
__________________
Por una web con mucho estilo
+++ CUENTA ABANDONADA. ¿la quieres? +++

Última edición por kseso?; 03/11/2008 a las 13:20
  #11 (permalink)  
Antiguo 03/11/2008, 13:17
Avatar de Aresillo
Colaborador
 
Fecha de Ingreso: marzo-2008
Ubicación: Becerril de la Sierra
Mensajes: 958
Antigüedad: 9 años, 8 meses
Puntos: 53
Respuesta: Como se Alinea al centro del navegador toda la pagina?

He de decirte querido kseso? que ese código no va a funcionar porque al parecer tenemos un estilo que es:
Cita:
#vontenedor {margin: 0 auto;
width: 970px; /*es muy importante que tenga definida una anchura, (ya lo aprendí, Mik ;)*/
/*resto de las propiedades que quieras definir*/}
y una llamada al contenedor!

Bueno que es una broma... per o de todas formas Daxe que no se te olvide poner en los dos contenedor!

Aresillo!!
  #12 (permalink)  
Antiguo 03/11/2008, 13:21
Avatar de Mikmoro
Colaborador
 
Fecha de Ingreso: octubre-2006
Ubicación: K-pax
Mensajes: 7.228
Antigüedad: 11 años, 2 meses
Puntos: 279
Respuesta: Como se Alinea al centro del navegador toda la pagina?

Cita:
Iniciado por kseso? Ver Mensaje

Creo que a partir de hoy haré un contador con las veces que se responde ésto
Lo gracioso es que muy a menudo la respuesta es diferente.

En este caso: si tu contenedor tiene posición absoluta no podrás centrarlo a menos que sepas y controles el tamaño de ancho. Este es tu contenedor:

<div style='position:absolute;width:10.4319in;height:6. 9006in'>

Si tu programa ha generado todo ese código debes plantearte abandonarlo cuanto antes; es espantoso.

P.D.: ¿has visto, kseso?? este no lo teníamos en la colección: anchura y altura en "inches" Nunca me dejare de sorprender.
__________________
Visita mi nueva web idplus.org
  #13 (permalink)  
Antiguo 03/11/2008, 13:39
Colaborador
 
Fecha de Ingreso: junio-2007
Mensajes: 5.798
Antigüedad: 10 años, 6 meses
Puntos: 538
Respuesta: Como se Alinea al centro del navegador toda la pagina?

Cita:
Iniciado por Mikmoro Ver Mensaje
Lo gracioso es que muy a menudo la respuesta es diferente.

En este caso: si tu contenedor tiene posición absoluta no podrás centrarlo a menos que sepas y controles el tamaño de ancho. Este es tu contenedor:

<div style='position:absolute;width:10.4319in;height:6. 9006in'>

Si tu programa ha generado todo ese código debes plantearte abandonarlo cuanto antes; es espantoso.

P.D.: ¿has visto, kseso?? este no lo teníamos en la colección: anchura y altura en "inches" Nunca me dejare de sorprender.
Yo de las medidas americanas e inglesas sólo me quedo con la pinta, si es en cerveza, en malt ya me paso el vaso bajo

Pero ya comenzaba diciendo que me olvidaba de su código (superior a mi ignorancia y atrevimiento jeje)
__________________
Por una web con mucho estilo
+++ CUENTA ABANDONADA. ¿la quieres? +++
  #14 (permalink)  
Antiguo 03/11/2008, 17:32
Avatar de Mikmoro
Colaborador
 
Fecha de Ingreso: octubre-2006
Ubicación: K-pax
Mensajes: 7.228
Antigüedad: 11 años, 2 meses
Puntos: 279
Respuesta: Como se Alinea al centro del navegador toda la pagina?

Cita:
Iniciado por kseso? Ver Mensaje
Yo de las medidas americanas e inglesas sólo me quedo con la pinta, si es en cerveza, en malt ya me paso el vaso bajo
Y qué feo es inches comparado con pulgada

Y por cierto, Daxe: que no se centre tu página es el menor de tus problemas; es que si no es con explorer, ¡no se puede entrar!
__________________
Visita mi nueva web idplus.org
  #15 (permalink)  
Antiguo 03/11/2008, 17:52
Colaborador
 
Fecha de Ingreso: junio-2007
Mensajes: 5.798
Antigüedad: 10 años, 6 meses
Puntos: 538
Respuesta: Como se Alinea al centro del navegador toda la pagina?

Cita:
Iniciado por Mikmoro Ver Mensaje
Y qué feo es inches comparado con pulgada

Y por cierto, Daxe: que no se centre tu página es el menor de tus problemas; es que si no es con explorer, ¡no se puede entrar!
Es cierto!
Hay que irse a "ver código" para copiar el enlace de "entrar", y una vez dentro el "mailto" y algún otro enlace tampoco...
···············..............···············
¡chinches y pulgas! :-p y cuando crecen les ponen galones ¿en el pecho o las hombreras?
Ya lo dijo Axteris: "Estos ingleses están locos"
__________________
Por una web con mucho estilo
+++ CUENTA ABANDONADA. ¿la quieres? +++
Atención: Estás leyendo un tema que no tiene actividad desde hace más de 6 MESES, te recomendamos abrir un Nuevo tema en lugar de responder al actual.
Respuesta




La zona horaria es GMT -6. Ahora son las 12:47.