13 November

埋め込んだgoogle map をレスポンシブにする

http://www.lifehacker.jp/2013/12/131209google_maps_responsive.html

google map の<iframe>を覆う　<div id="googlemap"> をつくり指定する

.googlemap {
    position: relative;
    padding-bottom: 56.25%;　// 縦横比
    height: 0px;
    overflow: hidden;
    margin-bottom: 70px;
}

.googlemap iframe, .googlemap object, .googlemap embed {
    position: absolute;
    top: 0px;
    left: 0px;
    width: 100% !important;
    height: 100% !important;
}