おわりこれで解決!比率を固定する方法Googleカレンダーは、共有機能を使って誰でも予定を見られるように公開することができます。公開したGoogleカレンダーをサイトに埋め込んだ時、スマホで見る時だけ縦長いということはありませんか?縦長になると文字が見にくいという問題が出てきます。これを解決するには、まずGoogleカレンダーの埋め込みコード内にある「width」と「height」の値を「100%」に指定します。Googleカレンダーの埋め込みコードをHTMLに記載するときは、適当なdivで囲んであげましょう。--></div>それから以下のCSSを追加すると、縦横比が固定されるため、PCで見てもスマホで見ても同じ比率で表示することができます。100%;}「.google-calendar1:before」の「padding-top」で高さを取っているので、%の値を変えると好きな比率に変更できます。実際に埋め込んでみました完成形はこんな感じです。スマホで見ても、ウィンドウサイズを変えても同じ比率で表示されます。おわり以上、「Googleカレンダーがスマホで見ると縦長になってしまう時の対処法」でした。お役に立てれば幸いです。