Div sale de la pantalla al empequeñecer la ventana del navegador

[linternazo]

Hola amiguetes:

Os voy a plantear mi problema a ver si vosotros le veis alguna solución.


Todo el contenido de mi web está en un div container de 1000px centrado.
Se muestra perfectamente. El problema viene al hacer la ventana del navegador más pequeña. Al ir reduciéndola, este div container va saliendo por la izquierda y se pierde la información. Ni siquiera puedo verla usando el scroll horizontal.

Como una imagen vale más que mil palabras, os dejo 3.

1.- Mi web en estado "normal"


2.- Al reducir un poco el navegador, va eliminado bien espacio de los márgenes.


3.- Al reducir un poco más el tamaño del browser, el contenido va despareciendo de la pantalla.



Lo suyo es que el contenido desaparezca por la derecha y el usuario pueda verlo moviendo el scroll.

Este es mi div container en CSS.

#container
{
position: absolute;
width: 1000px;
height: 500px;
left: 50%;
margin-left: -500px;
}


Se os ocurre qué puede ser? Muchas gracias.

[PrendekZ]

#container{
position: absolute;
width: 1000px;
height: 500px;
left: 50%;
margin-left: -500px;
}

Saludos ^^

[linternazo]

Sí, sí. Es así como está en mi código pero no funciona.

Alguien sabe por qué puede ser?
Es esa la mejor forma para alinear un div container en el centro de pantalla?

[samu22]

Iniciado por linternazo

Sí, sí. Es así como está en mi código pero no funciona.

Alguien sabe por qué puede ser?
Es esa la mejor forma para alinear un div container en el centro de pantalla?

estas dandole un 50% de tamaño a la izquierda, ese 50% lo esta tomando de la medida de la ventana y no del div.

La mejor forma de centrar el div es dando una medida absoluta al bloque contenedor y darle un margen automatico.

Código HTML:

<div id="contenedor">
      <span>Probando</span>
</div>
 

Código CSS:

body {
        background:#000000;
}
 
#contenedor {
        width:960px;
        margin:0 auto;
        background:#FFFFFF;
}
 

[linternazo]

Muchas gracias Samu22, eres un figura.

Ya no ocurre ese efecto!