disculpa, quiza estuve equivocada y no me expresé bien al principio, pero es lo que queria decir con la primera imagen. cuando decia ancho variable para el gris me refería a que si faltaba contenido en el rojo o en el verde, el gris ocupase ese espacio.
con tablas me resultó muy fácil hacerlo, pero con divs se me atraganta. lo de quitarle el contenedor ya lo habia intentado, y de esa manera funciona perfecto siempre y cuando no haya contenido en el rojo... porque en cuanto le metes algo, se desplaza hacia arriba junto con el gris.
y la verdad es que tampoco termino de entender muy bien por qué en el html el rojo debe ir primero
creo que de tantas horas luchando con esto me está afectando a las neuronas!!!!!!!!