無法設置頁腳底部

我有這樣的代碼：無法設置頁腳底部

<div id="login-frame" class="frame-container"> 
<h2>Dash</h2> 
<p>Wellcome</p> 
<hr> 
<div class="alert hidden"></div> 
<div class="frame-content"> 

<div class="row"> 
    <div id="appuntamenti_futuri" class="command-buttons tile col-xs-6 btn"> 
    <b class="title">Appuntamenti futuri</b> 
    </div> 
    <div id="storico_appuntamenti" class="command-buttons tile col-xs-6 btn"> 
    <b class="title">Storico</b> 
    </div> 
</div> 

<div class="row"> 
    <div id="prenotazioni" class="command-buttons tile col-xs-12 btn"> 
    <b class="title">Prenota</b> 
    </div> 
</div> 

<div class="row"> 
    <div id="card" class="command-buttons tile col-xs-6 btn"> 
    <b class="title">Card</b> 
    </div> 
    <div id="prepagate" class="command-buttons tile col-xs-6 btn"> 
    <b class="title">Abbonamento prepagate</b> 
    </div> 
</div>

<div id="frame-footer"> 
    <span style="color: #FFFFFF">Developed by</span> 
    <a href="#" target="_blank"> 
       Someone 
    </a> 
<span id="select-language" class="label label-warning"> 
        Language 
</span> 
</div> 

</div>

，這是一個jsfiddle

你怎麼看頁腳是不是在底部但在它後面有一條空白線，我設置了身體的背景以向您顯示問題。我做錯了什麼？

來源

2016-01-20 Sandokan

我看不到任何空行？或者你的意思是說，無論身體裏有多少內容，都有一個固定的頁腳總是粘在屏幕的底部？ –

對不起，我已更新jsfiddle，無論如何，是的，我想要固定在div底部的頁腳 – Sandokan

好吧，檢查我的答案，如果這就是你的意思 –

對任何頁腳元素設爲您需要使用position: absolute或position: fixed底部。請閱讀此文章about Position in CSS以獲取完整參考。

在所需的頁腳元素的父級上使用position: relative將確保您的頁腳元素（現在具有position: absolute）相對於其父元素。緊接着，在頁腳元素上使用bottom: 0將直接將其推到屏幕的底部。從那裏開始，您可以將其寬度設置爲width: 100%，這將創建頁腳的絕對基本佈局。

最後，不言而喻，請確保您的html和body元素覆蓋整個屏幕，以便您的頁腳真正位於屏幕的底部。我寫了一個很簡單的例子（某種模板）位置：

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

.my-page-wrapper { 
    position: relative; 
} 

.my-bottom-footer { 
    position: absolute; 
    bottom: 0; 
}

總之，將上述意見，你的代碼產生以下JSFiddle。

讓我知道如果您有任何問題。根據我上面的jsfiddle和下面的評論

編輯

，我們的結論是，所有需要的是頁腳元素直接坐在login-frame元素，我刪除position: absolute和bottom: 0之下。問題的相關部分，即頁腳元素中的border-top屬性，都是必須從代碼中刪除的部分。這可以在更新的JSFiddle中看到。

來源

2016-01-20 16:06:57 AGE

目前想知道那倒票... – AGE

我不知道，它不是我，反正你的解決方案很有趣但不適合我 – Sandokan

@Sandokan沒關係，所以這是不是爲你工作，解釋**什麼**給我，所以我可以幫助 – AGE

我想做一些類似的年齡前。試試這個作爲一個CSS類在你的DIV

bottom:36px; 
position:fixed; 
z-index:150; 
_position:absolute; 
_top:expression(eval(document.documentElement.scrollTop+ 
    (document.documentElement.clientHeight-this.offsetHeight))); 
height:30px; 
width:500px; 
margin-left:205px; 
background:#efefef; 
color:#000000; 
overflow:auto;

來源

2016-01-20 16:06:07 user3759531

bottom would = 0px不是36px – user3759531

_「我想做類似年齡的事情」_ - 是的，它顯示在代碼中。它早該被埋葬了。（鐵'表達'有糟糕的表現...） – CBroe

不知道如果我正確認識你，但是這應該是你想要什麼：

#frame-footer { 
    position:fixed; 
    left:0px; 
    bottom:0px; 
    height:30px; 
    width:100%; 
    background:#999; 
}

來源

2016-01-20 16:13:14

不，我希望頁腳必須固定在父div的底部位置。我不知道我是否清楚，但是，頁腳是在一個div裏面，我只是想將頁腳放在這個div的底部。 – Sandokan

頁腳IS位於div的底部，稱爲「登錄框架」。如果你出於某種原因仍然想要固定它，只需添加位置：fixed;寬度：100％;到＃frame-footer –

無法設置頁腳底部

回答

相關問題