0

2列のレイアウトを使用しています。1つはメインコンテンツ用、もう1つはサイドバー用です。

HTMLでは次のコードを使用しています

<div id="content">
     <div id="main-content">
       -----------
       -----------
     </div>

     <div id="sidebar">
      -----------
      ----------
      </div>

 </div>

 <div id="footer">
   ----------
   ----------
 </div>

CSSファイル次のコードで構成されています

  #content
{
padding-top:100px;
padding-bottom:50px;
width:1000px;
    margin:0px auto;

}

  #main-content
{

width:720px;
padding-top:250px;
    padding-bottom:30px;
    padding-right:20px;
position : absolute;
}

 #sidebar

{
float:right;
width:270px;
    padding-top:250px;
    padding-bottom:30px;

}

 #footer
{
background: url(../images/footer.jpg) repeat-x;
    width:100%;
clear:both;
    margin:auto;

}

フッターコードはページの中央に表示されます。おそらくサイドバーの最後に表示されます。フッターは黒色です。

4

2 に答える 2

2

CSSで削除position: absoluteします。#main-contentあなたはそれを必要としません。要素を絶対位置に配置すると、これはドキュメントフローから外れます。

この場合、を設定position: absoulteする#main-contentと、フッターをレンダリングするためにその高さが無視されます。

于 2012-09-30T09:04:22.123 に答える
1

からプロパティを削除padding-right: 20pxしますposition: absolutediv.#main-content

于 2012-09-30T09:04:14.193 に答える