頁腳底部中間文字

無論內容中有多少文字，我都試圖將頁腳留在底部。我在做什麼錯？佈局是：頁腳底部中間文字

.top{ 
    width:500px; 
    height:100px; 
    background-color:black; 
} 

.content{ 
    width:500px; 
    min-height:100%; 
    position:relative; 
} 

.footer{ 
    width:500px; 
    height:100px; 
    background-color:blue; 
    position:absolute; 
    bottom:0; 
} 

<div class="top"></div> 
<div class="content"></div> 
<div class="footer"></div>

http://jsfiddle.net/RDuWn/68/

的問候，西蒙

來源

2013-02-20 simon

可能重複http://stackoverflow.com/questions/42294 /如何獲得頁腳底部的頁腳） – 2013-02-20 15:33:14

可能的重複[如何讓頁腳始終位於頁面底部頁面？]（http://stackoverflow.com/questions/14960467/how-to-keep-footer-always-at-the-bottom-of-a-page） – Win 2013-02-20 16:17:30

我認爲你必須使用位置：固定這樣的：

.footer{ 
    width:500px; 
    height:100px; 
    background-color:blue; 
    position:fixed 
    bottom:0; 
}

DEMO

來源

2013-02-20 15:31:58

我會從刪除 Fiddle

來源

2013-02-20 15:32:17 dezman

在jsfiddle，

.footer{ 
    width:500px; 
    height:100px; 
    background-color:blue; 
    position:fixed; 
    bottom:-1px; 
}

作品我..

看到fiddle

看到bottom:-1px;這將確保在整個瀏覽器中的位置......

來源

2013-02-20 15:32:54

您的代碼有效，但您需要在頁腳中設置最小高度而不是高度這樣它可以延伸到您的內容大小。

.footer{ 
    width:500px; 
    min-height:100px; 
    background-color:blue; 
    position:fixed; 
    bottom:-1px; 
}

Here's how it will look這個變化，以及一些佔位符內容添加到頁腳。

來源

2013-02-20 15:34:36 BumbleB2na

這是您的絕對定位導致重疊。在確定位置時，絕對元素將從正常流程中移除並本身被其他元素「忽略」。如果你沒有在css中指定一個位置，它默認爲靜態定位，並且所有元素都將正確地位於「流」中。

http://www.w3schools.com/css/css_positioning.asp

這是我使用的CSS：

.top{ 
    width:500px; 
    height:100px; 
    background-color:pink; 
} 

.content{ 
    width:500px; 
    min-height:100%; 
    background-color:blue; 
} 

.footer{ 
    width:500px; 
    height:100px; 
    background-color:black; 
    margin-bottom:0px; 
}

的[？你怎麼頁腳留在網頁的底部（

來源

2013-02-20 16:11:02

頁腳底部中間文字

回答

相關問題