動画で練習32

参考ブログ

初心者でもわかるHTML&CSS講座　イタリアンレストランホームページを作る | Inoma Createｋ

※ブログ内に練習用のデータあり

－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－

アクセスエリア

・地図の情報のレイアウトをスマホ用に変更#access iframe 

・地図とアクセス情報のレイアウト解除後、縦に並べます。

・アクセスロゴ「#access_logo」が大きすぎるので、「 width: 70%;」に縮小

・地図の「#access_map」の「float」を解除「none」

・横幅「width」を「100%」指定

・アクセステキスト「#access_txt」の「float」を解除「none」

・横幅「width」を「: 90%;」指定

・「margin」を左側「left」に「: 30px;」指定

・グーグルマップから持ってきた地図「#access iframe 」の横幅「width」を「: 100%;」指定

－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－

ブラウザ

↑修正前

↑適用できました。