GoogleMapの埋め込む地図をCSSでレスポンシブ対応させ伸縮させる方法

GoogleMapも前回メモしたYoutube動画の埋め込みと同じで、取得したコードをそのまま張り付けただけだとレスポンシブ構造の場合に小さくした時に厄介です。 対応方法は、基本的にYoutube動画と同じような感じです。 GoogleMapのコードを取得 Googleマップにアクセスし、コードを取得したい場所を検索で表示させます。 表示が確認出来たら右下の歯車のアイコンから地図を共有または埋め込むを選択しコードを取得します。 地図のサイズは、これから設定するCSSを使うのであれば、どのサイズでも問題ありません。 自分は、最初から選択されている中を選択しています。 CSSとHTML 下記のCSSとHTMLを表示したい箇所に設置して作業完了です。 CSS<style type="text/css"> <!-- .gmap{ position: relative; padding-bottom