Foros del Web » Creando para Internet » CSS »

Se ve malísimo en IE7 y en la vista de compatibilidad del 8

Estas en el tema de Se ve malísimo en IE7 y en la vista de compatibilidad del 8 en el foro de CSS en Foros del Web. Hola! Estoy nuevo en esto del css, y ahorita estoy haciendo una panilla con formulario. En Mozilla y Opera no hay ningun problema. Pero resulta ...
  #1 (permalink)  
Antiguo 25/10/2009, 23:26
 
Fecha de Ingreso: septiembre-2009
Mensajes: 86
Antigüedad: 8 años, 3 meses
Puntos: 0
Se ve malísimo en IE7 y en la vista de compatibilidad del 8

Hola!

Estoy nuevo en esto del css, y ahorita estoy haciendo una panilla con formulario. En Mozilla y Opera no hay ningun problema. Pero resulta que en IE7 y solo en la vista de compatibilidad del 8 casi todo se mueve, es como si tomara márgenes mayores, no se de donde. Lo mas seguro, es que como estoy aprendiendo , en el código CSS haya algo demás o mal que el IE lo toma como margen. no se!

El código CSS es el siguiente:


Código:
/*basicos*/
body  {
	text-align:center;
	font-family: Trebuchet MS, Calibri; 
	background-image:url(http://planilla/body/arboles.jpg);
	background-color:#b2ddd4;
	margin-left:35px;
	background-position:center bottom;
	background-repeat:no-repeat;
	}
#wrap {
	width:1130px;
	margin:0 auto;
	margin-top:-15px;
	padding:5px;
	text-align:left;
	}
#top {
	width:770px;
	height:278px;
	background-image:url(http://imagenes/blanco_top.png);
	background-repeat:no-repeat;
	margin-left: 190px;
	margin-top:200px;		
}
#content {
	width:770px;
	height:1900px;
	background-image:url(http://imagenes/blanco_content.png);
	background-repeat:repeat-y;
	margin-left: 190px;					
}
#bottom {
	width:769px;
	height:57px;
	background-image:url(http://imagenes/blanco_bottom.png);
	background-repeat:no-repeat;
	margin-left: 190px;		
}
#logoMP {
	position:absolute;
	width:399px;
	height:301px;
	background-image:url(http://Basics/logo_mp.png);
	background-repeat:no-repeat;
	margin-left: 182px;			
}
#titulo {
	position:absolute;
	width:309px;
	height:126px;
	background-image:url(http://planilla/body/planilla.jpg);
	margin-left:245px;
	margin-top:220px;
	background-repeat:no-repeat;
}
#globo {
	position:fixed;
	width:289px;
	height:204px;
	margin-top:610px;
	margin-left:37px;
	background-image:url(http://Basics/globo.png);		
}

/*OtroSsSS*/

#arboles_arriba {
	position:absolute;
	background-image:url(http://planilla/body/arboles_arriba.jpg);
	background-repeat:no-repeat;
	background-position:center top;
	width:995px;
	height:584px;
	margin-left:80px;
}

/*---------->>Formulario<<----------*/

.form {
	background-color: #C6E8EA; border: 0px; width: 275px; color:#999999; font-weight:bolder;}
.form1 {
	background-color: #C6E8EA; border: 0px; width: 275px; color:#999999; height:60px; font-weight:bolder;}
.inputs {
	{font-size:13px; color:#EAEAEA; font-weight:normal;}

}
#formulario {
	background-position:center top;
	text-align:center;
	height:1800px;
}
.datos{font-size:17px; color:#EAEAEA; line-height:1.5em; font-weight:normal; width: 614px; margin-left: 80px; text-align:justify; }

.portada{background-color:transparent; border: 0px; width: 275px; color:#FFFFFF; font-size:13px; font-family: Comic Sans Ms,Trebuchet MS; border: #000099; height:330px; width:510px; font-weight:bolder; overflow-y:hidden;

}

#divportada{position:absolute; margin-top:126px; margin-left:48px; height:343px; width:525px;}

#portada {
	position:absolute;
	background-image:url(http://planilla/body/portada1.png);
	width:602px;
	height:683px;
	margin-top:10px;
}
#manzana {
	position:absolute;
	background-image:url(http://planilla/body/manzana1.png);
	width:82px;
	height:82px;
	background-repeat:no-repeat;
	margin-top:-74px;
	margin-left:424px;
}
.tem {
	width:478px;
	text-align:justify;
	margin-left:65px;
	margin-top:10px;
	font-size:19px; font-weight:bold; color:#FF9900;

}
	.trabajo {
		margin-top:20px;
		margin-left:10px;
		background-image:url(http://planilla/body/trabajo.jpg);
		background-repeat:no-repeat;
		width:126px;
		height:85px;
	}
	.Ptrabajo {
		margin-left:195px;
		width:275px;	
}

	.detallando {
		margin-top:20px;
		margin-left:20px;
		background-image:url(http://planilla/body/detallando.jpg);
		background-repeat:no-repeat;
		width:135px;
		height:75px;
	}
	.Pdetallando {
		margin-left:184px;
		width:275px;	
}

	.investigar {
		margin-top:20px;
		background-image:url(http://planilla/body/a-investigar.jpg);
		background-repeat:no-repeat;
		width:174px;
		height:74px;
	}
	.Pinvestigar {
	position:absolute;
		margin-top:-10px;
		margin-left:206px;
		width:275px;	
	}
	.Pitexto {line-height:15px; font-size:13px; color:#EAEAEA; font-weight:normal;}
	
/*PAQUETES*/

	.paquete {
		margin-top:20px;
		margin-left:13px;
		background-image:url(http://planilla/body/paquete.jpg);
		width:447px;
		height:122px;
	}
	
	.Paqinputs {
		margin-top:20px;
		margin-left:77px;
		line-height:15px;
		color:#EAEAEA;
}
.otros {
	background-color: #C6E8EA; border: 0px; width: 521px; color:#999999; height:100px; font-weight:bolder;}

#otros {
	margin-top:275px; font-size:19px; font-weight:bold; color:#FF9900;
		
}

Ah por cierto, en el Netscape el fondo de árboles arriba no se ve, que sería el div árboles_arriba...

Espero, si tienen el tiempo puedan ayudarme en estos detalles.

Gracias de antemano...

Última edición por kaiseer; 13/11/2009 a las 08:05
  #2 (permalink)  
Antiguo 25/10/2009, 23:29
Avatar de luckystrikede11  
Fecha de Ingreso: octubre-2009
Ubicación: Concepcion, Chile
Mensajes: 240
Antigüedad: 8 años, 2 meses
Puntos: 17
Respuesta: Se ve malísimo en IE7 y en la vista de compatibilidad del 8

usa siempre el modo de compatibilidad en IE8 cuando diseñes
  #3 (permalink)  
Antiguo 26/10/2009, 00:04
 
Fecha de Ingreso: septiembre-2009
Mensajes: 86
Antigüedad: 8 años, 3 meses
Puntos: 0
Respuesta: Se ve malísimo en IE7 y en la vista de compatibilidad del 8

Hola Lucystrikede, es cierto. Pero problema ahora, es que si logro que se vea bien la pagina en la vista de compatibilidad se vería mal y desordenado en Mozilla, Opera, Netscape...
  #4 (permalink)  
Antiguo 26/10/2009, 00:27
Avatar de luckystrikede11  
Fecha de Ingreso: octubre-2009
Ubicación: Concepcion, Chile
Mensajes: 240
Antigüedad: 8 años, 2 meses
Puntos: 17
Respuesta: Se ve malísimo en IE7 y en la vista de compatibilidad del 8

Cita:
Iniciado por kaiseer Ver Mensaje
Hola Lucystrikede, es cierto. Pero problema ahora, es que si logro que se vea bien la pagina en la vista de compatibilidad se vería mal y desordenado en Mozilla, Opera, Netscape...
vi el sitio (esta bueno el diseño).. pero me di cuenta que usaste espacios para marginar contenido.. eso no hace.. no propio de un diseño puro. si logras estructurar todo con CSS.. de seguro no tendras problema.

PD: si tengo tiempo mañana te puedo colocar algo de codigo.
  #5 (permalink)  
Antiguo 26/10/2009, 12:31
 
Fecha de Ingreso: septiembre-2009
Mensajes: 86
Antigüedad: 8 años, 3 meses
Puntos: 0
Respuesta: Se ve malísimo en IE7 y en la vista de compatibilidad del 8

Si, tienes razón.. Voy a comenzar por eso entonces, voy a ver si logro hacerlo sin espacios.. jeje.. gracias.
  #6 (permalink)  
Antiguo 26/10/2009, 23:15
 
Fecha de Ingreso: septiembre-2009
Mensajes: 86
Antigüedad: 8 años, 3 meses
Puntos: 0
Respuesta: Se ve malísimo en IE7 y en la vista de compatibilidad del 8

Hola lucky...! Ya he acomodado gran partre de los errores..! casi todo era porque habia colocado en el div del formulario "text-align:center". Esto mozilla lo tomaba solo para textos, mientras que ie 7 y compatibilidad del 8 centraban el texto y las divs tambien. Entonces si le sumas los margenes que habia colocado para que se viese centrado en mozilla y el IE 8 con el modo de compatibilidad desactivado mas el centrado ya hecho con el text-align:center en IE 7 hacia que todo se moviera el doble ..! Se entiende?

Lo único es que quedan 2 cosas a las que no les he encontrado solucion.. Al fondo de arboles arriba, que se ve más hacia la derecha.. y que si le presionas a los inputs de radio (a las V) la pagina se mueve..! sabrás que puedo hacer?
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 08:02.