画面の底に座ってから私のフッタを止める

Question

私は画面の一番下に止まっていて、ページの一番下に座っていない私のフッタに問題があります。ページの下部は画面の下部にありませんか？

footer { 
 
    position: fixed; 
 
    left: 0px; 
 
    bottom: 0px; 
 
    height: 70px; 
 
    width: 100%; 
 
    background: #2c2c2c; 
 
} 
 

 
#footer_container { 
 
    max-width: 940px; 
 
    height: 70px; 
 
    margin: 0 auto; 
 
    padding-top: 2%; 
 
} 
 

 
.social { 
 
    list-style-type: none; 
 
} 
 

 
.social li a { 
 
    position: absolute; 
 
    bottom: 0; 
 
    right: 0; 
 
    display: inline; 
 
    float: right; 
 
    padding: 10px; 
 
    text-decoration: none; 
 
    color: #FFFFFF; 
 
    font-weight: bolder; 
 
} 
 

 
.social>li>a:hover { 
 
    color: #D9D9D9 
 
} 
 

 
.copyright_text { 
 
    position: absolute; 
 
    bottom: -10px; 
 
    left: 0; 
 
    padding-top: 2%; 
 
    float: left; 
 
    text-transform: uppercase; 
 
    font-size: 0.30cm; 
 
    color: #fff; 
 
    margin-left: 20px; 
 
} 
 

 
.logo_footer { 
 
    display: flex; 
 
    align-items: center; 
 
    position: fixed; 
 
    left: 0px; 
 
    bottom: 15px; 
 
    height: 50px; 
 
    width: 100%; 
 
    margin-left: 20px; 
 
    margin-bottom: 5px; 
 
}

<footer> 
 
    <div id="footer_container"> 
 
    <img src="images/logo.png" title="AccountPanda" style="width:112.5px;height:37.5px;" class="logo_footer"> 
 
    <p class="copyright_text">&copy; Copyright 2017 AccountPARADISE</p> 
 
    <ul class="social"> 
 
     <li><a href="https://twitter.com/accountparadise" target="_blank">TWITTER</a></li> 
 
    </ul> 
 
    </div> 
 

 
</footer>

Answer 1

あなたはポジションを使用する場合：固定します。あなたの要素ではなく、あなたの画面に依存する場所にキャストされます。

落としたければ、複数のことができます。親コンテナの位置は、相対的な位置は絶対の底：0にすることができます。

または、ブロックを表示して他のhtmlコンテナの下に配置してください。

このようにして、残りの部分とページの一番下に並べられます。

Answer 2

position: fixedを使用しないでください。フッターのCSSルールから消去してください。その上にある他のすべての要素の下に表示されます。 （leftとbottomのパラメータも消去することができます。この場合は、「配置済み」要素にのみ関連します）