頁腳沒有正確排隊

Question

由於某種原因，我的頁腳似乎沒有正確排列整頁。

我確實有一個包含類的網站的主體，所以我的頁腳的底部確實與網站的主體排隊。然而，因爲它佔據了屏幕的100％，它現在將網站推向右側的量相當於將其從左側推開。我希望這是有道理的。我已經在div類之外獲得了我的頁腳，但它似乎仍然像在裏面一樣。另一方面，我的導航欄似乎完美地佔據了整個屏幕。任何想法我很困惑。

這是我的頁腳代碼

{% load staticfiles %} 

<style> 
{% block style %} 
html { 
    position: relative; 
    min-height: 100%; 
} 
body { 
    /* Margin bottom by footer height */ 
    margin-bottom: 60px; 
} 
.footer { 
    position: absolute; 
    bottom: 0; 
    width: 100%; 
    /* Set the fixed height of the footer here */ 
    height: 60px; 
    background-color: #f5f5f5; 
} 


{% endblock %} 
</style> 

<footer class="footer" > 
     <div class="container-fluid"> 
     <p class="text-muted">Place sticky footer content here.</p> 
     </div> 
</footer> 

和IM然後用{% include 'footer.html' %}下</script>和內部</body>在我base.html文件

Answer 1

由於您使用的位置absolute那麼你必須設置left: 0跨越全頁寬

.footer { 
    position: absolute; 
    bottom: 0; 
    left: 0; 
    width: 100%; 
    ... 
}