CSS位置固定底部頁腳

-1

我正在嘗試將頁腳固定在底部，儘管我在頁面上的位置。我試過CSS位置固定底部頁腳

.home-footer{ 
    position: fixed; 
    bottom: 0; 
    right: 0; 
    left: 0; 
    z-index: 5; 
}

但它只適用於我將腳註放在身體外並將它放置在html元素下方的位置。我如何在保持身體健康的同時做到這一點？

編輯我發現問題是我的身體有transform: translateX(0)。這似乎與固定頁腳衝突，因爲一旦我擺脫了這一點，它就起作用了。但是，我需要這個規則，否則我的導航幻燈片會中斷。

來源

2016-07-27 Jordan Carter

我們需要查看HTML和CSS的其餘部分，以便說明問題所在。 –

添加到您的CSS：

html, body { 
    width: 100%; 
    height: 100%; 
}

來源

2016-07-27 14:17:58

最初將它推到底部，但當我向下滾動時，它不會隨頁面一起滾動。 –

我認爲答案在這裏 - > http://stackoverflow.com/questions/5189238/how-to-make-a-footer-fixed-in-the-page-bottom –

試試這個：

HTML：

<body> 
    <div class="container"> 
    <footer>Your footer</footer> 
    </div> 
</body>

CSS：

// wrapper in your body, where your footer will be in 
.container { 
    position: absolute; 
    top: 30px; 
} 

footer { 
    position: relative; 
    bottom: 0; 
    width: 100%; 
    height: 20px; 
}

來源

2016-07-27 14:20:04

這不是我正在尋找的東西對於。我希望CSS始終在屏幕上可見，但底部。所以，它會在我們滾動頁面時移動。 –

我更新了我的問題。基本上這是一個轉換在身體上的問題，這似乎與固定位置的頁腳發生衝突。 –

我發現問題是將變換應用於身體並具有固定頁腳之間的衝突。似乎有一個問題將這兩條規則結合在一起。我使用了左側定位來製作動畫，而不是轉換，並解決了問題。這不是理想的，但它的工作。

來源

2016-07-27 15:49:53

CSS位置固定底部頁腳

回答

相關問題