trataré de explicarme lo mejor posible:
Tengo un div, en el cual le agrego otros divs los cuales el usuario deberá poder manipular arrastrándolo y redimensionándolo (Para ello utilizo librerías de JQuery). El problema viene cuando agrego varios divs (Usando append(html) ); digamos que el usuario arrastra el primer div a la posición que quera, luego se agrega un segundo div (Ya desde allí hay un problema, si el primer div se agregó en la coordenada 0,0 y es de 50px de altura, entonces el segundo div aparece en la coordenada 0,51; cosa que no debería pasar) y lo posiciona en cualquier otro lugar... el segundo problema (Y más pesado) es que si redimensiona el primer div acomodado, el segundo div se ve afectado; me explico, si hace que el primer div sea más alto, entonces el segundo div se desplaza hacia abajo, lo mismo cuando se hace más corto el div.
Lo explico con las siguientes imágenes, los divs son los del marco negro, los rectángulos de colores son una imagen de fondo:
Como ven, hay tres div; el div de la izquierda fue el último en agregarse.
Si agrandamos hacia abajo ese último div (izquierda), entonces los otros dos divs se desplazan también hasta abajo, como si el primer div los empujara aunque visualmente no están en fila:
Sé que esto tiene que ver que para el DOM sí están alineados uno siguiente del otro aunque sean manipulados con javascript; pero quisiera saber si hay alguna forma de que (con css o lo que sea) de que los divs no se estorben, que no sean "sólidos", se puedan colapsar o cualquier cosa que me ayude a evitar ese problema.
Muchas gracias.