Foros del Web » Creando para Internet » CSS »

[SOLUCIONADO] Divs se "pegan" en la parte izquierda del navegador

Estas en el tema de Divs se "pegan" en la parte izquierda del navegador en el foro de CSS en Foros del Web. Hola que tal, Tengo un problema, pues pretedndo que cuando se redimencione el navegador, los divs permanescan centrados pero esto no sucede al REDIMENSIONAR el ...
  #1 (permalink)  
Antiguo 29/10/2015, 19:16
 
Fecha de Ingreso: octubre-2015
Mensajes: 5
Antigüedad: 8 años, 4 meses
Puntos: 0
Exclamación Divs se "pegan" en la parte izquierda del navegador

Hola que tal,
Tengo un problema, pues pretedndo que cuando se redimencione el navegador,
los divs permanescan centrados pero esto no sucede al REDIMENSIONAR el navegador. pues los divs se "pegan" en la parte izquierda del mismo.
Por cierto aca les muestro un ejemplo simple ya que lo que tengo realizado es mas complejo oviamente, pero para no complicar pongo algo simple con poco codigo, pero
con ver un ejemplo me apaño.


En definitiva quiero que cuando se redimensione el navegador los divs permanescan centrados junto con un background tambien, es decir el background que debo poner en body debe coincidir con el centro exacto(verticalmente) de los divs en todo momento aun cuando se redimencione el navegador, espero haberme explicado.


En la imagen de abajo se puede ver como se redimensiona el navegador y no pasa
nada debido al tamaño de los divs, preo en la otra imagen...



Pero cuando redimensiono mas el navegador todos los divs se pegan a la izquierda y si pongo un background en body deja de estar centrado verticalmente



Codigo html

Código:
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<link type="text/css" rel="stylesheet" href="stylesheet.css"/>
<title>Home2</title>
</head>
<body>
		<div id="cabezera"><p>CABEZERA</p></div>
    	<div id="cuerpo"><p>CUERPO</p></div>
</body>
</html>
Código CSS

Código:
body {
	margin:0px;
}
#cabezera {
	border: solid 4px black;
	margin: 0px auto;
	width: 500px;
	height:88px;
	display: block;
	position:relative;
}
#cuerpo {
	border: solid 4px red;
	width: 1000px;
	height: 500px;
	margin: 5px auto;
	display:block;
	position: relative;
}
P {
	text-align:center;
	font-family:Arial;
}
  #2 (permalink)  
Antiguo 29/10/2015, 20:35
Avatar de xfxstudios  
Fecha de Ingreso: junio-2015
Ubicación: Valencia - Venezuela
Mensajes: 2.448
Antigüedad: 8 años, 9 meses
Puntos: 263
Respuesta: Divs se "pegan" en la parte izquierda del navegador

estas utilizando una medida que acepta ajuste, por ejemplo, en los DIVs tienes el whidth en 500px o 1000px, lo que deberias de hacer es utilizar por ejemplo porcentajes:

Código CSS:
Ver original
  1. }
  2. #cabezera {
  3.     border: solid 4px black;
  4.     margin: 0px auto;
  5.     width: 60%;
  6.     height:88px;
  7.     display: block;
  8.     position:relative;
  9. }
  10. #cuerpo {
  11.     border: solid 4px red;
  12.     width: 90%;
  13.     height: 500px;
  14.     margin: 5px auto;
  15.     display:block;
  16.     position: relative;
  17. }

de esa manera estos va a estar siempre al 80 y 60% respectivamente en relacion al ancho de la pantalla del dispositivo y lo que te indica la barra no es que se pegaron a la izquierda, si no que se desbordaron hacia la derecha porque no tiene el ancho ajustable
__________________
[email protected]
HITCEL

Última edición por xfxstudios; 30/10/2015 a las 00:00
  #3 (permalink)  
Antiguo 30/10/2015, 12:02
 
Fecha de Ingreso: octubre-2015
Mensajes: 5
Antigüedad: 8 años, 4 meses
Puntos: 0
Respuesta: Divs se "pegan" en la parte izquierda del navegador

No no se entendio que es lo que quiero, lo que quiero es que el fondo que debo ponerle al achicar ventana no se desface en relacion a los divs, pero no importa ya lo resolvi.

Lo que hice fue colocar el respectivo background (el cual no lo incorpore en el ejemplo) en body, y luego hice un div que engloba a los otros divs y puse el recorte del background que le corresponde a esa posicion y tamaño del div, por lo que cuando se redimensiona el navegador los divs se corresponderan con el background
sin que se dezplazen de la correspondencia con background en cuanto a posicion.

Gracias por haber respondido, aunque no lo parezca tu respuesta aunque no
me sirvió para lo que quería, si me hizo pensar y es gracias a tu respuesta que los
sucesos porsteriores se dieron en el orden que se dieron para llegar a la solución.

En pocas palabras me ayudaste mas de lo que crees
Gracias por tu ayuda lo resolví.
Gracias!!
Gracias!!
Gracias!!
Eurekaaa!! grito mientras salgo desnudo de la bañera para dirigirme a la calle a gritarlo mas fuerte aún EUREKKKAAA!!!!

Etiquetas: background, divs, izquierda, navegador
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 07:01.