Posicionamiento div CSS (+JS?).
4 seguidores
Aqui un flashero voluntarioso pero que está pez en HTML+CSS / JS tiene una duda (posiblemente tonta)
Necesito posicionar un div de tamaño fijo de 1200x800 dentro del navegador. La lógica del posicionamineto es:
Si el ancho del navegador es mayor que 1200 centramos el div horizontalmente. Si es menor, posicionamos el div en x=0.
Si el alto del navegador es mayor que 800 centramos el div verticalmente. Si es menor, posicionamos el div en y=0.
Alguien puede aportar un poco de luz a mi penumbra?
muchas gracias de antemano.
Mag
yo haría esto si no he entendido mal:
#content {
margin: 0 auto;
width:1200px;
text-align:center; (este es un hack para explorer)
}
elSuricatoRojo
Gracias Mag,
Con ello consigo posicionarlo horizontalmente casi según la lógica. El casi es por unos px de margen entre el div y el borde izq.
Pero creo que no sirve para el posicionamiento vertical.... incluso poniendo, un a priori esperanzador, "height:800x;"
adriia
Aquí tienes un ejemplo para alinear verticalmente: http://www.forosdelweb.com/f53/centrar-div-verticalmente-285717/
Aunque no se me ocurre la manera de que cuando la capa que está alineada al centro llegue a la parte superior, se quede y no siga subiendo.
elSuricatoRojo
Muchas gracias adriia
Hugo Palomar
Hola...
El centrado vertical en css no existe para elementos block, inline, inline block, etc... para centrar algo verticalmente debes declar display:table-cell y vertical-align:middle al contenedor (un div contenedor vacio, comunmente el wrapper) y funcionará.
El otro problema que te encontrarás es que para que el wrapper tenga el alto del window, deberas declarar height:100%, al html y al body.
de memoria sería algo asi:
HTML:
<div class="wrapper">
<div class="content"></div>
</div>
CSS:
html, body, .wrapper: {height:100%}
.wrapper {display:table-cell; vertical-align:middle}
si quieres tambien podrías usar jquery... para detectar el alto del window, el del contenido, dividir la diferencia por dos y aplicarsela como margen superior al contendio