Problemas con una web, desplazamiento de elementos.

[KLAYMAN]

Hola a todo el foro y antes de nada gracias por leeros mi mensaje.

Vereis estaba realizando una web que tanto en local como online se veían perfectamente, pero me he encontrado con el gran problema de que en algunos ordenadores se descuadra y no le encuentro ningún sentido. Por ejemplo, el diseño es fijo (no líquido), con lo cual no debería de tener demasiados problemas, pero nada de nada... no paro de tocar cosas y cada vez se ve mas horrible

¿Algunos de vosotros me podríais decir que es lo que falla o simplemente hacerme una lista de vuestro navegador y resolución y cómo la veis?, a modo de recabar información de cuál es el problema. Esta tarde/noche recabaré información de los navegadores que se ven mal y os los pondré por aquí para ver si los podeis verificar.

Empiezo yo:
Sistema Operativo: Windows Vista x64
Resolución: 1280x1024px. Navegador: Internet Explorer 7.0.6001.18000 OK
Resolución: 1280x1024px. Navegador: Mozilla Firefox 3.0.5 OK
Resolución: 1280x1024px. Navegador: Opera 9.63 OK


Sistema Operativo: Windows Vista x64
Resolución: 1024x768px. Navegador: Internet Explorer 7.0.6001.18000 OK
Resolución: 1024x768px. Navegador: Mozilla Firefox 3.0.5 OK
Resolución: 1024x768px. Navegador: Opera 9.63 OK


Sistema Operativo: Windows XP SP2
Resolución: 1280x1024px. Navegador: Internet Explorer 7.0.5730.11 OK
Resolución: 1280x1024px. Navegador: Mozilla Firefox 3.0.5 OK
Resolución: 1280x1024px. Navegador: Google Chrome 1.0.154.36 OK


De momento con que me mireis la web principal, es más que suficiente porque hay secciones que no están subidas todavía.
http://www.geministudios.es

Muchas gracias por adelantado y un saludo a todos.

[kseso?]

¡Otra vez a sacar la bola de cristal!

Klaiman, procura ser algo más concreto al exponer malfuncionamientos. Cuanto más genérica es la consulta, menos probabilidades tienes de obtener una respuesta certera.

Veo que todas las resoluciones que marcas como OK son 1280px, independientemente del navegador usado, así que la bola dice que el problema será a menor resolución, por lo que presuntamente estaríamos ante un problema por la diferente interpretación del modelo de cajas.

Espacio total: dimensión del div + márgenes + bordes...

Si reduces la anchura en algunos px de los elementos que se descuadran, posiblemente el problema desaparecerá.

[KLAYMAN]

Hola kseso? y antes de nada agradecerte tu respuesta.

No es sacar la bola de cristal, sólamente quería saber si le ocurre a la mayoría de la gente o sólo son casos esporádicos. No es mi intención hacer perder el tiempo a la gente.

Por ejemplo, el fallo más habitual es que las tres cajas que forman el centro de la web se desplacen. Y como he expuesto, en tres ordenadores que he probado a 1280x1024 eso no ocurre y en otro a 1024x768 tampoco ocurre, pero sin embargo he ido a uno que a 1024x768 sí da ese fallo y el centro se desplaza de forma incomprensible.

Supongo que será dependiendo de la versión del navegador, por eso me gustaría saber si la veis bien o no y con que navegadores falla.

Un saludo y perdona si te he molestado al pedir algo tan generalizado.

[kseso?]

Nah, Klayman. No te preocupes.

Esos desplazamientos suelen ser, como te decía, por la interpretación distinta que hacen algunos navegadores del modelo de cajas.

Prueba lo que te comentaba. Reduce algo la anchura de alguna caja.

[KLAYMAN]

Muchas gracias kseso?

Debe ser algún problema con lo que tú dices, he modificado un par de atributos que quizás estuvieran dando algún tipo de problema. No se si la web seguirá viendose igual o la he liado todavía más

Esta tarde voy a probar en el ordenador que se descuadraba todo el bloque central, porque he preguntado a algunas personas por IRC y todos las ven bien. Como aquí no me habéis dicho que se vea mal tampoco, pues debe ser lo que me has comentado, algún navegador puntual que no interpreta bien el código.

Un saludo y de nuevo os reitero las gracias a todos. kseso? te debo una

[kseso?]

Apúntala en el agua, klayman

Puedes ver tú mismo esos descuadres redimensionando la ventana del navegador.
Y para obtener mucha más información de tu web (o cualquier otra) usa firefox + web developer
Es un complemento que podrás bajarte de su web.

[KLAYMAN]

kseso? muchas gracias me ha sido de mucha utilidad el consejo de utilizar web developer.

Pero ahora viene el problema, tal y como me comentaste los desplazamientos eran producidos por la interpretación distinta que hacen algunos navegadores del modelo de cajas. Mi problema ocurre con Internet Explorer 6

Entonces lanzo mi pregunta. Me he dado cuenta que tengo que dejar para Internet Explorer 6 menos distancia en los margenes y en el tamaño de los divs.

Pregunta: ¿Cómo puedo hacer para que dependiendo de si el navegador es Internet Explorer 6 se utilice un código u otro código? ¿Tengo que hacer dos hojas de estilo o puedo hacerlo de una forma mas elegante? He visto que se puede utilizar el código <!--[if lte IE 6]> para referirnos a este tipo de problemas pero no logro entender como funciona, ¿me podeis ayudar?

¿Es correcto hacer esto?

<head>
<title>Título</title>
<link href="all_browsers.css" rel="stylesheet" type="text/css">
<!--[if IE]> <link href="ie_any_version.css" rel="stylesheet" type="text/css"> <![endif]-->
<!--[if lt IE 7]> <link href="ie_6_and_below.css" rel="stylesheet" type="text/css"> <![endif]-->
<!--[if !lt IE 7]><![IGNORE[--><![IGNORE[]]> <link href="recent_versions.css" rel="stylesheet" type="text/css"> <!--<![endif]-->
<!--[if !IE]>--> <link href="not_ie.css" rel="stylesheet" type="text/css"> <!--<![endif]-->

Muchas gracias por todo y un saludo a todos.

[kseso?]

Hola Klayman
lo que se persigue con el comentario condicional <!--[if lte IE 6]> es que ie6 cargue una segunda hoja de estilos. Unica y exclusivamente la versión/nes que indicas.

En esa segunda hoja de estilo, no es necesario definir todos y cada uno de los elementos y sus propiedades, sino SOLAMENTE aquellas propiedades de aquellos elemento que ie no maneja correctamente.

Un saludo