Tengo un layout de 2 columnas: la primera con un mapa y la segunda con info. He conseguido que el iframe del mapa se ajuste al ancho, pero no se como hacer para ampliar la altura dinamicamente y que el mapa sea de la misma altura que el texto que lo acompaña.
Alguna idea???
MVCE: https://jsfiddle.net/w5h49j1f/
HTML (basico):
<div class="row">
<div class="column">
<iframe src="https://www.google.com/maps/embed?pb=!1m18!1m12!1m3!1d2516.555272130855!2d4.339358315458401!3d50.894940979539264!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x47c3c3ac00000001%3A0x5293071d68a63709!2sAtomium!5e0!3m2!1sca!2ses!4v1530871671353"
width="95%" height="auto" // he probado poner px o porcentaje
</iframe>
</div>
<div class="column">
<div> informacion del lugar </div>
</div>
</div>
CSS:
.column {
float: left;
width: 50%;
}
/* Clear floats after the columns */
.row:after {
content: "";
display: table;
clear: both;
}