0

私は 2 つの div を持っています。トップ div のスタイルは次のとおりです。

.context_left {
    float:left;
    display:inline-block;
    width:775px;
    padding-left:10px;
    margin-top:20px;
    min-height:450px;
    margin-bottom:20px;   
}

その下のdivにはスタイルがあります：

  .footer {
        width:100%;
        height:54px;
        display:block;
        position: absolute;
        margin-top:80px;
        left:0;   
  }

div context_left が高さを変更すると、div フッターはその位置に残ります。 context_left div が高さを変更した場合、フッター div を下に移動したいと思います。誰でも私がそれをするのを手伝ってもらえますか?

4

5 に答える 5

1

このラインを .footer に追加しようとしましたか

  clear:both;

そして位置を削除します：絶対;

于 2013-08-21T11:08:57.717 に答える
0

CSS:

 .context_left {
        float:left;
        width:775px;
        padding-left:10px;
        margin-top:20px;
        min-height:450px;
        margin-bottom:20px;  
        display:inline-block;

    }


      .footer {
            width:100%;
            height:54px;
            display: block;
            clear:both;
            margin-top:80px;
            left:0;   

      }

作業フィドル: http://jsfiddle.net/dMawS/show

于 2013-08-21T11:17:12.670 に答える
0

ページの下部にあるスティッキー フッターが探しているものである場合、これが役に立ちます。

html {
    width: 100%;
    min-height: 100%;
    margin: 0;
    padding: 0;
}

body {
    /* the margin compensates the footer plus the footer's top margin */
    margin: 0 0 134px 0;
}

footer {
    position: absolute;
    bottom: 0;
    width: 100%;
    height: 54px;
}

フッターは常にブラウザーのビューポートの下部またはコンテンツの下にあります。

デモ

購入前にお試しください

于 2013-08-21T11:21:13.300 に答える
0 
.footer {
    width:100%;
    height:54px;
    display:block;
    margin-top:80px;
    left:0;   
}

position: absoultefrom フッターを削除しました。これを試して。フッターは position:absolute まで同じ位置に留まるため、スタイルは維持されます。

于 2013-08-21T11:07:14.723 に答える
0

position: absolute; でフッターを設定しました。つまり、フッターは少し固定する必要がありますが、親から継承する必要があります。

絶対を相対に変更してみて、それが必要かどうかを確認してください。

于 2013-08-21T11:08:56.077 に答える