iframe float et texte responsive
Bonjour,
Je souhaite que les coordonnées du site soit sur la gauche et que la map soit à droite. J'essaye que ce soit responsive, que la map s'adapte et descende sous le texte lors du zoom. Je bloque, pouvez vous m'aider svp
le html
Code:
1 2 3 4 5 6 7 8 9 10 11
| <div id="Global">
<div id="gauche">
<h1>Contact</h1>
<p>1 rue bidon</p>
</div>
<div id="droite">
<div class="map-responsive">
<iframe src="https://www.google.com/maps/embed?pb=!1m18!1m12!1m3!1d2626.1563142515106!2d2.234953315507061!3d48.83615701022629!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x47e67ae7245a2c9d%3A0x4b21331773b0459c!" width="450" height="300" frameborder="0" style="border:0" allowfullscreen></iframe>
</div>
</div> |
Le css
Code:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21
| .map-responsive {
overflow:hidden;
padding-bottom:50%;
position:relative;>
height:0;
}
.map-responsive iframe {
left:0;
top:0;
height:100%;
width:100%;
position:absolute;
}
#Global #gauche {
float:left;
width:30%;
}
#Global #droite {
margin-left:30%; |