頁腳不會調整頁面大小

我希望我的頁腳調整我的移動設備上的頁面大小或屏幕的大小，使其看起來並不像一個非常大的空頁腳。頁腳不會調整頁面大小

HTML：

<footer> 
    <div class="footerwrapper"> 
    </div> 
</footer>

CSS：

footer { 
    height:100%; 
    border-top: 1px dashed #FDF3E7; 
    background-color:#250800; 
    text-align:left; 
} 

.footerwrapper { border-bottom: 1px dotted #3B3738;padding:50px;min-height:200px; background-color:#220a03; margin: 0 auto; }

如上圖所示，我試着與我的父母頁腳重疊的包裝，但它並沒有真正的工作就是我想要的。實際上，我只希望腳註填充頁面的其餘部分（也適用於移動設備），而不會淹沒頁腳。任何人？

來源

2014-01-09 maikovich

可以創建的jsfiddle？ – Freedom

css文件：

footer{ 
    min-height:200px; //you can define any height you like! 
} 
footer .footerwrapper { 
    border-bottom: 1px dotted #3B3738; 
    background-color:#220a03; 
    margin: 0 auto; 
    width: 500px;// this width you can define your self 
    position: fixed; 
    bottom: 0; 
}

來源

2014-01-09 02:34:42 jingyinggong

更改CSS的footer像波紋管。

footer { 
    border-top: 1px dashed #FDF3E7; 
    background-color: #250800; 
    text-align: left; 
    position: fixed; 
    left: 0px; 
    right: 0px; 
}

看到http://jsfiddle.net/7Ybrn/

來源

2014-01-09 03:08:24 Freedom

如果你正在使用jQuery，你可以做到這一點，調整你的身高

$windowHeight = $('window').height() 
$mainDivHeight = $('.yourMainDiv').height() 
$footerHeight = $('footer').height() 

// check if the space is larger your footer height then adjust to that height for footer 
if(($windowHeight - $mainDivHeight) > $footerHeight) { 
    $('footer').height($windowHeight - $mainDivHeight) 
}

來源

2014-01-09 03:31:23

頁腳不會調整頁面大小

回答

相關問題