動画で練習27 - 森のプログラミング練習ブログ

参考ブログ

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

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

アクセスのレイアウト調整

アクセスエリアのスタイル指定＝「#access」
文字揃えを「text-align」　中央揃えに「center」　「text-align: center;」
グーグルマップから持ってきた地図の大きさを微調整＝「#access iframe」
横幅「width」を「70％」に縮小します＝「width: 70%;」
「#access_logo」＝見出しとの位置関係を微調整＝「margin-bottom: -40px;」
地図と住所の情報を横並びにする＝「#access_map」で「float」プロパティで「left」指定＝「float: left;」　幅を「width」を「: 50%;」指定＝「width: 50%;」
アクセスのテキスト＝「#access_txt」「float: right;」横幅「width」を「５０%」指定
文字揃え「text-align」を「left」指定
上余白の調整「margin-top」を「60px」程空けます。
電話番号を書いた要素＝「#access_reserve」
「margin-top: 30px;」　下余白＝「margin-bottom」を「30px」指定
「#access_map」と「#access_txt」を「flort」設定にしているのでhtmlのテキストで<div class="clearlist"></div>を設置