bootstrap3のfooter固定


bodyにmargin-bottom付けてfooterをそこに固定するって方法。レスポンシブ対応
検証中です。
HTML部分

<!DOCTYPE html>
<html lang="en">
<head>
</head>
<body>
    body
<footer>
    footer
</footer>
</body>

</html>

CSS部分

html {
 position: relative;
 min-height: 100%;
}
body{
 margin-bottom: 200px;
/* footerの高さの最大値 */
 padding-bottom: 0;
}
footer{
 min-height: 100px;
/* footerの最小値 */
 width:100%;
 position: absolute;
 bottom: 0;
 margin-bottom: 0;
}

投稿日: 2015年1月6日
カテゴリー: html | 投稿者: