Html 我的边栏在页脚下_Html_Css_Web_Footer_Sidebar

Html 我的边栏在页脚下

html css web

Html 我的边栏在页脚下,html,css,web,footer,sidebar,Html,Css,Web,Footer,Sidebar,我已经建立了一个练习网站，但边栏一直在页脚下或与之混合。下面是所有代码（至少一页）和稍后的css。我只是需要一个快速的帮助，我知道一个公平的份额，但不多，所以请帮助 <!doctype html> <html> <head> <meta charset-"utf-8"> <title>Polyverse</title> <link rel="stylesheet" href="style.css"> </h

我已经建立了一个练习网站，但边栏一直在页脚下或与之混合。下面是所有代码（至少一页）和稍后的css。我只是需要一个快速的帮助，我知道一个公平的份额，但不多，所以请帮助

<!doctype html>
<html>
<head>
<meta charset-"utf-8">
<title>Polyverse</title>
<link rel="stylesheet" href="style.css">
</head>
<!--main part-->
<!--header-->
<body>
<div id="container">
    <div>
        <body background="images/bg.jpg"></div>
    <div id="header">
        <h1><center><img src="images/header.png" width="960" height="120"         alt=">/center></h1>
<!--navbar-->
        <nav id="navbar">
            <ul>
                <li><a href="index.html">Home</a></li>
                <li><a href="about.html">About</a></li>
                <li><a href="articles.html">Articles</a></li>
                <li><a href="downloads.html">Downloads</a></li>
                <li><a href="contact.html">Contact Us</a></li>
            </ul>
        </nav>
    </div>
<!--main content-->
    <div id="sidebar">
        <p>And my sidebar stuff here.</p>
    </div>
    <div id="main">
    <h1><p>About</p></h1>
    <article><p>All my text goes here</p></article>
    </div>
<!--footer-->   
    <div id="footer">
    <address><p align=right>Last updated the 24th of July 2013<br> Polyverse     copyright</p> 
        </address>
    </div>
</div>
</body>
</html>

所以我只是想知道，我该如何修复它

如果您可以删除

位置：绝对

只需清除页脚即可：

#footer {
    clear: both;
}

这两个

都将防止元素向左（如

#main

）或向右（如

#侧栏

）浮动

如果您只是想清除

#侧栏

，而不是

#main

，请使用

清除：对
好吧，除了HTML充满错误之外，我建议将容器
设置为一个类，并将其添加到顶部容器之后。是清除
您的浮动

就像这样。。。（还清理了您的HTML）

上次更新于2013年7月24日
Polyverse版权所有
我建议在继续修复CSS之前修复HTML代码中的所有错误。您的CSS和HTML都会加载语法错误。在尝试排除任何其他故障之前，请先解决这些问题。好的，一切正常。我在.container类中输入了宽度，但每当我为标题添加标记时，中的剩余文本都会穿过页脚的虚线。更多的帮助？请
#footer {
    clear: both;
}

<div class="container">
    <div id="footer" class="clearfix"> <address><p align="right">Last updated the 24th of July 2013<br/> Polyverse     copyright</p> 
    </address>
    </div>
</div>