Problemas con firefox

[davidbons]

Estimados amigos, tengo una web http://www.moniersl.com y no consigo que la capa contenedora se vea igual en mozilla e internet explorer, por ejemplo si ven http://www.moniersl.com/arquitectura/ingenieria-malaga.php en mozilla se ve un "escalon en la parte derecha muy feo" que no se ve en internet explorer, y no se porque puede ser.

[SI TAN SOLO TUVIERA]

Mira, si no estoy mal, eso te esta pasando porque el DIV #padre_intro le pusiste de largo 800px.

Y el espacio que ocupan estas dos animaciones juntas es de mas de 800px. Mozilla respeta el espacio y no deja ke el div se agrande mas de esos 800px que le diste y por eso el descuadre, Internet explorer en cambio estira el DIV padre_intro, realmente el problema ahi es de internet explorer, como cosa rara.

Lo que podrias hacer seria, darle 900px de width a ese div padre intro. Creo que si, te faltan como 100px para llegar al espacio ke ocupan las dos animaciones.

[SI TAN SOLO TUVIERA]

Mira volviendo nuevamente a ver tu pagina, el problema tambien esta en que para centrar ésta, estas usando un margin izquierdo de 400px. Y resulta que mozilla e internet explorer interpretan de manera diferente estas cosas, igual pasa con el padding.

Lo que creo que debes hacer, es quitarle ese "margin-left:-400px;" al .padre_intro que estas usando para centrar este div y en la pagina principal dodne useas este div: <div id="padre_intro"> meterle otro antes que te centre todo lo que tenga adentro <div align="center"> <div id="padre_intro"> ... ... </div></div>

Ah y tambien dale 900px a este padre_intro. Las dos animaciones juntas miden mas de 800px.

y creo qeu con eso, espero haberme hecho entender.

[davidbons]

gracias por tu ayuda, he resuelto el problema de la página principal, pero me pasa lo mismo en otras, que son de diseño distinto. pero no es el mismo fallo, por ejemplo en esta: http://www.moniersl.com/arquitectura/ingenieria-malaga.php, y no puedo solucionarlo aumentando el tamaño de la capa contenedora

[SI TAN SOLO TUVIERA]

Hola.

Es practicamente el mismo problema.

Ve a tu archivo de CSS (style.css), como lo tienes nombrado y al div #container aumentale el largo o width. En esta parte, te lo subrayo:

#container {style.css (line 14)
background-color:#FFFFFF;
margin:0px auto;
text-align:center;
width:760px;
}

Dale 900px o aumentale hasta que se te ajuste y la imagen de cabecera que tienes o el div #header no sobrepase ese DIV (#container).

[davidbons]

Ya probé eso pero parece que no funciona, se aumenta el tamaño del contenedor, pero sigue permaneciendo el escalón.

[Nono Martínez]

A div#holder quitale el width:100%, con eso se soluciona que el fondo no llegue hasta su sitio.

Aparte creo que el problema es que no te caben ambos el div: el de la derecha tiene un padding muy grande y no deja pasar al de la izquierda. Ampliando a 770px y reduciendo el padding, consegui que entrara. No se si este cambio afecto a IE6/7.

Para detectar este error instalate el addon de Mozilla: Firebug. Puedes modificar la web on-line al instante, editar CSS, Javascript debug. Te recomendaría que trabajases en primera instancia con Mozilla y observando su reaccion en IE6 y IE7. Es un buen metodo para conseguir el cross-browser. En IE hay un sucedaneo llamado Microsoft Web Developer Tool. Juntos son una herramienta poderosa.




Al diseñar una web hay que tener en cuenta el efecto cross-browser , lee un poco sobre el tema googleando, es importante para CSS/XHTML. Para mí hay tres navegadores, IE6 (que se pasa por alto la mitad de las especificaciones de la w3c, desactualizado, pero aun como navegador por defecto en la mayoria de los ordenadores), IE7 (que todavia tiene muchas carencias) y Mozilla (actualizado, en la medida de sus posibilidades).