ボトムスティッキーフッタオーバーラップコンテンツ

Question

私のページにはボトムのフッタが付いていますが、その内容は重なっています。これは、フッターの特定の高さを設定することなく、これを修正する方法であり、html、bodyで同じ高さにマージンをかけることですか？

私のサイトへのリンク：https://www.rajohan.no/index.php?page=movie&category=commingは

Answer 1

あなたcontentbox idはまた、多分あなたは#content上でこれらのスタイルを使用している場合、それは

Answer 2

を支援する高さだ調整、フッタのためのスペースを占有し

display: flex; 
flex-direction: column; 
max-height: 100vh; 

のみ#content_boxはスクロール可能

Answer 3

#content_boxがページの残りの部分を占めるように設定されている場合あなたの#bottomがページの一番下にくるように設定されていれば、それはあなたが見ることができるようにオーバーラップするでしょう。

この問題に取り組む最も良い方法は、#bottomという非常に広い部屋を割り当てることです。スケーラビリティが心配ならば、これをパーセンテージで行うことができます。その向こう

、あなたが試みることができる：

また

#content_box { 
    background-color: #ffffff; 
    min-width: 100%; 
    min-height: 75vh; 
    text-align: center; 
    padding-top: 20px; 
    overflow-y: auto; 
    display: inline-block; 
    } 
#bottom { 
    background-color: #4d4d4d; 
    min-width: 100%; 
    padding-bottom: 5px; 
    border-top: 1px solid #e87f29; 
    color: #efefef; 
    text-align: center; 
    /* position: fixed; */ 
    bottom: 0; 
    display: inline-block; 
} 

を、あなたのページがスクロールしないことに注意してください:)