EN IE se ve bien pero en firefox fatal

miros84 · #1 (**permalink**) 28/01/2009, 14:59

Hola. Estoy configurando unos divs, que en IE salen bien, pero en firefox fatal. Os dejo la url para que echais un vistazo.
http://dmn-design.com/miro/m/EJERCICIOS/ej_09_meet/
El codigo css esta en: http://dmn-design.com/miro/m/EJERCIC...meet/style.css
Espero que alguien sabe decirme donde esta el problema.

kseso? · #2 (**permalink**) 28/01/2009, 15:21

¿Y el problema es...?
¿Podrías precisar, por favor?

miros84 · #3 (**permalink**) 28/01/2009, 15:25

Pues si se ve en los dos browsers, se ve claro. He creado un div que en IE sale abajo del todo, tal y como lo cnofigure con css. Tiene el fondo azul este div. Pero en firefox sale en medio de la ventana. El codigo css es:
#adddiv
{
width:940px;
margin:auto
height:auto;
border:0px solid #808080;
padding:0px;
border:1px solid #808080;
margin-top:15px;
background-color:#00FFFF;
}
Mejor ver enlaces. Alli se entiende bien

Aresillo · #4 (**permalink**) 28/01/2009, 15:41

añade esto al #adddiv:
clear:both;

ares

kseso? · #5 (**permalink**) 28/01/2009, 15:43

Cita:

Iniciado por miros84

Pues si se ve en los dos browsers, se ve claro.

Partes de una premisa no cierta: que todos puedan usar los dos navegadores y que sepan qué quieres lograr.

Bueno, lo que ocurre es que todos los contenedores los tienes flotados, y estos no "ocupan" espacio físico.
Añade justo antes de abrir ese div (adddiv) y despues de cerrr el "rightflang" en el html:

Cita:

y en el css:

Cita:

.corte {clear:both;}

y así el pie se "dibujará" después de ellos.

Ah, por cierto, el comportamiento de FF es el correcto de acuerdo a la norma.

Un saludo

miros84 · #6 (**permalink**) 28/01/2009, 15:47

Muchas gracias. He podido solucionar mis problemas.
Pero ahora me estoy dando cuenta que al ponerle margin-top:25px; no se me va 25px para abajo del div mas cercano. No seria mejor entonces poner el div abajo del div central contenedor #container?
O hay alguna forma para bajarlo o situarlo. Es que voy a poner contenido dinamico en los divs y no quiero poner posiciones absolutas aun que se que con posiciones absolutas se trabaja muy facil y se consigue todo, pero para contenido dinamico me vienen fatal. Espero vuestro consejo.

kseso? · #7 (**permalink**) 28/01/2009, 16:04

En la página www.araudi.net (autor: "capo" Mikmoro) tienes varias plantillas con "pie abajo".
Mira a ver cuál se adapta mejor a tus necesidades.

miros84 · #8 (**permalink**) 28/01/2009, 16:31

A ver. Un poco de logica. Por que no puedo poner un contenedor div dentro de otro.
El css del primero 1. es:
{
width:940px;
margin:auto
height:auto;
border:0px solid #808080;
padding:0px;
border:1px solid #808080;
margin-top:15px;
background-color:#2266FF;
}

Y del segundo 2. es:
#add1
{
width:500px;
margin:auto;
height:300px;
border:1px solid #666680;
padding:0px;
top: 3px;
float:left;
}
Yo pongo el segundo 2. dentro del primero 1.
El problema aparece al poner el float:left;
Como lo pongo a la isquierda si no es con float:left;
Alguien me podria un poco mas de luz sobre esto que lo veo un poco oscuro...

Mikmoro · #9 (**permalink**) 28/01/2009, 17:08

Pues no sé, pero mantén el float left y quita el margin: auto, ¿no?

miros84 · #10 (**permalink**) 29/01/2009, 00:42

Pues, sigue igual. El primer div no se ajusta automaticamente a la altura del segunda div. Por cierto, sale asi con mozilla. En IE sale bien. Alguien tiene idea por que es esto?

Mikmoro · #11 (**permalink**) 29/01/2009, 01:29

Pon al primero overflow: auto.

conmenta1965 · #12 (**permalink**) 29/01/2009, 01:53

Hola. Lo que te ocurre es que la Cascada de tu Código CSS crea conflictos entre sí. Has decidido flotar parte de los bloques y en cambio otros no; eso te hace que los espacios relativos con valores por defecto (los que no tienen ningún valor de Propiedad de posicionamiento añadido) entren en conflicto con los que son relativos con valor añadido mediante "float".

En segundo lugar, la cascada de tu código está en colflicto entre sí, porque añades el valor de "margin" primeramente con un valor determinado y, después añades un nuevo valor por defecto (el que interpreta el navegador que procesa el documento al visualizarlo. Eso hace que la visualización de la página sea una imagen absoluta de conflicto de codificación en su cascada.

Exiten más de 3.000 formas diferentes de crear un contenido correcto, pero ello no significa que signifique 3.000 elevado a la potencia 3.000. Lo que significa que hay métodos CSS diferentes, pero no que sean estrictamente compatibles entre sí porque sean correctos o sean de una misma versión CSS.

Si quieres más información teórico y/o práctica sobre asunto, contacta.

Saludos.

Mikmoro · #13 (**permalink**) 29/01/2009, 02:10

Cita:

Iniciado por conmenta1965

Si quieres más información teórico y/o práctica sobre asunto, contacta.

Esto es un foro público, y si tienes más información deberías ofrecerla o no decir nada, porque si no parecerá que buscas contactos en privado.

Y referente a tu explicación, o documentas tu extraño razonamiento con ejemplos claros y entendibles o parecerá que has elegido unas bonitas frases de humo.

Dalvenjha · #14 (**permalink**) 29/01/2009, 08:21

Propongo algo bien FÁCIL para que entendamos lo que quieren hacer, que ahora los que piden ayuda en maquetación, primero pongan su código html y CSS y luego que pongan UN DIBUJO aunque sea en paint, sobre coo quieren que quede.

Creo que sería lo más sencillo, yo veo su página y no soy adivino para saber coo quería que quedara.

Saludos!!

miros84 · #15 (**permalink**) 29/01/2009, 15:52

Cita:

Iniciado por Mikmoro

Pon al primero overflow: auto.

Hola Mikmoro. Tu eres lo mejor. Asi lo tengo solucionado.
Y no entiendo muy bien la filosofia del conmenta1965. Pon ejemplos porque teoria pura no sirve mucho.

conmenta1965 · #16 (**permalink**) 29/01/2009, 17:21

Hola. Que me disculpe el Foro si parezco excesivamente divagador en mis comentarios pero pido que se entienda que al igual que hay miembros con más conocimientos sobre lenguajes, también los hay que tenemos menos de ello pero lo que para unos no son respuestas a sus necesidades, para otros es todo lo contrario, todo depende del nivel de comprensión que se necesite.

Existe la diferencia de los contenidos flotantes, los posicionados de forma absoluta, y los posicionados de forma relativa y, los no posicionados; ya que es cada Agente de usuario, en este último caso, el que determina la posición exacta. Incluido también el que IE 6 interpreta "width" como la suma total de esta propiedad mencionada más, el "padding" y más el "border" y dependiendo del DTD utilizado puede quedar la página en Modo quirks con sus correspondientes conflictos debido a la Cascada utilizada (CSS).

Saludos.

Mikmoro · #17 (**permalink**) 29/01/2009, 17:51

¿Y bien? ¿qué quieres decir con eso referido a la consulta?

Calizman · #18 (**permalink**) 29/01/2009, 19:20

Realmente esperaba encontrar un debate, algo asi como el hilo donde hacia una pagina con Word... no se eso esperaba encontrar aca...

Cita:

Hola. Que me disculpe el Foro si parezco excesivamente divagador en mis comentarios pero pido que se entienda que al igual que hay miembros con más conocimientos sobre lenguajes, también los hay que tenemos menos de ello pero lo que para unos no son respuestas a sus necesidades, para otros es todo lo contrario, todo depende del nivel de comprensión que se necesite.

Existe la diferencia de los contenidos flotantes, los posicionados de forma absoluta, y los posicionados de forma relativa y, los no posicionados; ya que es cada Agente de usuario, en este último caso, el que determina la posición exacta. Incluido también el que IE 6 interpreta "width" como la suma total de esta propiedad mencionada más, el "padding" y más el "border" y dependiendo del DTD utilizado puede quedar la página en Modo quirks con sus correspondientes conflictos debido a la Cascada utilizada (CSS).

Saludos.

Creo que solucionare la duda de Mikmoro por imposible que suene... lo que yo entiendo que hace aqui conmenta1965 es simplificar los terminos para que la gente que tiene "poco tiempo en la programacion CSS" entienda que fue lo que aqui se hizo, y esta explicando las diferentes posiciones de un div.

Eso entiendo yo! y lastima que no hay discucion... xD

Saludos!!