如何向上或向下移動div？

我有兩個div，頂部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。任何人都可以幫助我做到這一點？

來源

2013-08-21 Nouman

只要你有絕對定位頁腳它不會被流動的影響。如果沒有對結構的清晰概念，我不能推薦任何東西，只需從.footer中刪除絕對位置即可。也許清除它，以防萬一.context_left流入它。 –

創建小提琴將有助於理解除位置之外的實際問題：絕對在頁腳 –

它看起來像這樣：http://jsfiddle.net/tLueq/？ –

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

從頁腳中刪除了position: absoulte。嘗試這個。因爲頁腳將保持在相同的位置直到位置：絕對保持風格。

來源

2013-08-21 11:07:14

你已經設置了頁腳的位置：absolute ;.這意味着你的頁腳應該有點固定，但是要繼承它的父項。

嘗試將絕對值更改爲相對值，看看這是否是你想要的。

來源

2013-08-21 11:08:56 Renato

你有沒有嘗試這個河旁添加到您的.footer

clear:both;

和刪除的位置是：絕對的;

來源

2013-08-21 11:08:57

的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; 

     }

工作小提琴：

來源

2013-08-21 11:17:12

我不想在左側和右側有空格或邊距，因爲我已經使用position：absolute;通過消除這一點，我無法做我想做的事情，所以據我所知，沒有其他方法可以做到。 – Nouman

爲此，您可以將'margin：0;'添加到body。看到更新的小提琴。 @nouman –

請檢查一下我的佈局結構http://jsfiddle.net/VWcYt，加邊距：0;身體不適合我。 @Avin Varghese – Nouman

如果在頁面底部的粘性頁腳是，你找什麼，那麼這可以幫助你：

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; 
}

頁腳將始終位於瀏覽器的視口或下方的內容下方。

演示

Try before buy

來源

2013-08-21 11:21:13 insertusernamehere

如何向上或向下移動div？

回答

相關問題