Html 停止导航重叠页脚_Html_Css

Html 停止导航重叠页脚

html css

Html 停止导航重叠页脚,html,css,Html,Css,我在屏幕的左侧有一个导航列表，但是这个列表与我的页脚重叠。我想把我的页脚放在页面底部的正中央，在导航栏下面以下是我的导航和页脚CSS： #playerMenu{ position:absolute; left:10px; top:245px; list-style-type:none; text-align: center; color: white; width:240px; font-family: sans-serif;

我在屏幕的左侧有一个导航列表，但是这个列表与我的页脚重叠。我想把我的页脚放在页面底部的正中央，在导航栏下面

以下是我的导航和页脚CSS：

#playerMenu{
    position:absolute;
    left:10px;
    top:245px;
    list-style-type:none;
    text-align: center;
    color: white;
    width:240px;
    font-family: sans-serif;
    font-size: small;
    background: #4b4d59;
    border-radius: 5px;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    -o-border-radius: 5px;
    background: linear-gradient(top, #535561 0%, #1f1f23 100%);
    background: -moz-linear-gradient(top, #535562 0%, #202023 100%);
    background: -webkit-linear-gradient(top, #535562 0%, #202023 100%);
    background: -ms-linear-gradient(top, #535562 0%, #202023 100%);
}



#playerMenu ul {
    list-style-type:none;
    padding:0;
}

#playerMenu li a{
    transition: color .3s ease;
    -moz-transition: color .3s ease;
    -webkit-transition: color .3s ease;
    -ms-transition: color .3s ease;
    border-bottom: : 1px solid #393942;
    border-top: 1px solid #393942;
}

#playerMenu a {
    display:block;
    color: white;
    padding: 4px 4px;
    text-decoration: none;
    font-family: sans-serif;
} 




.footer {
    width: 680px;
    height: 20px;
    margin:auto;
}

.footerContent {
    font-family: sans-serif;
    color: #FFF;
    float:left;
    width:100%;
    margin-top: 10px;
    margin-bottom: 10px;
    border-radius: 5px;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    background: linear-gradient(top, #535561 0%, #1f1f23 100%);
    background: -moz-linear-gradient(top, #535562 0%, #202023 100%);
    background: -webkit-linear-gradient(top, #535562 0%, #202023 100%);
    background: -ms-linear-gradient(top, #535562 0%, #202023 100%);   
}

.footer p {
    float:left; width:100%; text-align:center;
}

将所有内容放在容器div中，然后将页脚放在另一个div中：

<body>
<containerdiv>
<!-- All content -->
</containerdiv>
<footer>
</footer>
</body>

请不要链接到您的网站。原因如下：提示：若你们不想重叠，就不要使用绝对定位。对不起，并没有意识到，删除了链接。谢谢我认为这可能与此有关，但是当我尝试新的定位效果时，它也没有放在我想要的位置，是否有更多关于使用什么定位的提示？完成此操作后，它似乎不起作用，我是否应该删除/添加一些额外的定位？