メインページのテンプレートの修正と画面確認
<< 前のページ 2カラムレイアウトの概要とスタイルシート
メインページのテンプレートのコンテンツ(content)部分の下に、サイドバー(sidebar)の部分を追記します。以下のソースを見ると、非常に簡単な追記であることがわかります。
HTMLのテーブルタグを使用せずに、スタイルシートでレイアウトを決めているため、つまり、HTMLのソースでレイアウトを設定する必要が無いため、見やすくなりますし、検索エンジン対策にもなります。(現状の検索エンジンはレイアウトではなく、記述された文書を好みます。)
<div id="sidebar">
サイドバー。サイドバー。サイドバー。サイドバー。サイドバー。サイドバー。サイドバー。サイドバー。サイドバー。サイドバー。サイドバー。サイドバー。サイドバー。サイドバー。サイドバー。サイドバー。サイドバー。サイドバー。
</div>
追記後、再構築して実際にブラウザで見てみます。
サイドバーが右側に追加されたことがわかります。
ですが、本来ページ下部にあったはずのフッタの部分がサイドバーの下に移動してしまいました。
次回はこの問題の解決方法を紹介します。
次のページ >> clear:both;を忘れずに