Instabridge | Love Addict | The Punisher 4K Blu-ray review
Menu

Comment responsive et centrer lien de google map ? [Résolu]

Tiger46 240 Messages postés lundi 30 septembre 2013Date d'inscription 12 octobre 2018 Dernière intervention - 10 oct. 2018 à 23:02 - Dernière réponse : Tiger46 240 Messages postés lundi 30 septembre 2013Date d'inscription 12 octobre 2018 Dernière intervention
- 12 oct. 2018 à 01:23
Bonjour ...
lorsqu'on va sur google map on peut avoir le code pour intégrer la map dans une iframe mais la map ensuite n'est pas responsive apparemment ou ne s'adapte pas en taille aux mobiles et n'est pas centrée ?

Ca donne ce code actuellement :

<iframe src="http://www.google.com/maps/embed?pb=!1m14!1m8!1m3!1d11388.116177725571!2d1.428995!3d44.4735774!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x0%3A0x1a0c92ec02a4136e!2sGarage+Mari%C3%A9!5e0!3m2!1sfr!2sfr!4v1539204166329" width="600" height="450" frameborder="0" style="border:0" allowfullscreen></iframe>


Peut on arranger ça et si oui comment ? Merci :) ...

Merci :)
Afficher la suite 

Votre réponse

11 réponses

dugenou 5207 Messages postés mercredi 19 janvier 2005Date d'inscriptionContributeurStatut 11 octobre 2018 Dernière intervention - 11 oct. 2018 à 07:17
0
Merci
Bonjour,

Dans ta feuille de style, tu peux donner une dimension maxi à l'iframe, par exemple :

iframe {
        margin-left:auto;
        margin-right:auto;
        max-width: 100%;
    } 


Si tu n'utilises pas de feuille de style, tu dois pouvoir aussi placer l'iframe dans une <div> et ajouter ce style directement à la <div> :

<div style="margin-left:auto; margin-right:auto; max-width:100%;">


Tiger46 240 Messages postés lundi 30 septembre 2013Date d'inscription 12 octobre 2018 Dernière intervention - 11 oct. 2018 à 16:20
Heu en fait je suis sur un logiciel ( webacapella ) ou je rajoute une case ou on peut mettre du code et j'ai mis le code plus haut ... j'ai pas de CSS ailleurs ou quoi juste ce code dans un cadre, qui affiche actuellement le facebook mais pas centré :) ...
dugenou 5207 Messages postés mercredi 19 janvier 2005Date d'inscriptionContributeurStatut 11 octobre 2018 Dernière intervention - 11 oct. 2018 à 17:48
Il serait préférable d'avoir une feuille de style, mais tu peux mettre le code CSS directement dans ta page HTML, en le plaçant entre les balises <style> </style>, dans la partie <head> de ta page.
Tiger46 240 Messages postés lundi 30 septembre 2013Date d'inscription 12 octobre 2018 Dernière intervention - 11 oct. 2018 à 18:02
Disons qu'il y a bcp d'élements et dans ce logiciel il est preferable de mettre juste le code juste dans le cadre contenant le html pour la map :) ... Du coup jevais essayer de le glisser quelquepart et voir :) ...
dugenou 5207 Messages postés mercredi 19 janvier 2005Date d'inscriptionContributeurStatut 11 octobre 2018 Dernière intervention - 11 oct. 2018 à 18:39
Dans ton code HTML, tu peux placer le style :

<div style="margin-left:auto; margin-right:auto; max-width:100%;" class="fb-page" data-href="http://www.facebook.com/Bijouterie-Lagarde-533675443667275/" data-tabs="timeline" data-width="500" data-small-header="false" data-adapt-container-width="false" data-hide-cover="false" data-show-facepile="false"><blockquote cite="http://www.facebook.com/Bijouterie-Lagarde-533675443667275/" class="fb-xfbml-parse-ignore"><a href="http://www.facebook.com/Bijouterie-Lagarde-533675443667275/">Bijouterie Lagarde</a></blockquote></div>
Tiger46 240 Messages postés lundi 30 septembre 2013Date d'inscription 12 octobre 2018 Dernière intervention - 12 oct. 2018 à 01:23
Commenter la réponse de dugenou