html - CSS：フッターを常に下部に配置します

Question

私は次のページレイアウトを持っています：

<header></header>
<div id="content"></div>
<aside></aside>
<footer>
 <ul>
  <li></li>
 </ul>
</footer>

ここで、フッターを正確に左隅に配置します。

text-align: left;
position: fixed;
bottom: 0;
margin: -16px -8px;

今は負のマージンであり、最善の解決策ではありません。フッターをコーナーに直接配置するためのより良い方法はありますか？

よろしく

Answer 1

このように書く：

text-align: left;
position: fixed;
bottom: 0;
left:0

Answer 2

このサイトをチェックするスティッキーフッター

例：

* {
    margin: 0;
}
html, body {
    height: 100%;
}
.wrapper {
    min-height: 100%;
    height: auto !important;
    height: 100%;
    margin: 0 auto -142px; /* the bottom margin is the negative value of the footer's height */
}
.footer, .push {
    height: 142px; /* .push must be the same height as .footer */
}

Answer 3

私にとっては、次のように機能します。

height: 58px;
position:relative;
bottom: -58px;

heightとの同じ値に注意してくださいbottom。そしてpostionへrelative。

Answer 4

HTML：

<div id="footer"></div>

CSS：

#footer {
   position:absolute;
   bottom:0;
   width:100%;
   height:60px;   /* Height of the footer */
   background:#6cf;
}