Eğer ki bir işletme sahibi iseniz, sitenize de Google Maps (Google Haritalar) iframe kodunu eklemiş olabilirsiniz. Ne yazık ki ilgili kod şu an için responsive değil. Bu yüzden Google haritalar kodunu responsive yapmak mantıklı bir tercih. Bunun için ise, aşağıdaki örnek CSS kodlarını kullanabilirsiniz. Aşağıda örnek kullanım verilmiş olup, kendinize ait iframe kodunu kullanmayı unutmayınız.
Google Haritalar Kodunu Responsive Yapalım
1) Temanızın CSS dosyasına aşağıdaki kodları ekleyiniz.
.google-haritalar {
position: relative;
padding-bottom: 50%;
height: 0;
overflow: hidden;
}
.google-haritalar iframe {
position: absolute;
top: 0;
left: 0;
width: 100% !important;
height: 100% !important;
}
2) İlgili iframe kodunu ise aşağıdaki şekilde kullanınız.
<div class="google-haritalar">
İlgili kodları buraya ekleyebilirsiniz.
</div>
Bu içeriğimizde, Google Haritalar kodunu responsive yapmak hakkında bilgi paylaşımında bulunduk. Eğer ki Google Maps iframe kodunu responsive yapmak istiyorsanız, yukardaki kodları kullanmanız yeterli olacaktır.
Yorum bulunmamaktadır.