我的页脚已连接到我的导航栏答案

【问题标题】：My footer is connected to my navigation column我的页脚已连接到我的导航栏
【发布时间】：2014-03-31 09:19:51
【问题描述】：

我正在为学校开发一个网站。我是 CSS 和 HTML 的新手，现在我的页脚卡在导航栏上。

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<html>
  <head>
    <img align="top" src="satellite.jpg" alt="Logo" height="202" width="342">
    <div id="wrapper">
    <div id="headerwrap">
    <div id="header">
     <link rel="stylesheet" type="text/css" href="713210.css">
    <title>Odyssey Space Toy</title>
  </head>
        </div>
        </div>
<div id="leftcolumnwrap">
        <div id="leftcolumn">
<table width="165" cellpadding="0" cellspacing="0">
    <tr>
        <td width="165" style="border: none; padding: 0in">
            <p><a href="Toy%20Works.html">Specifications</a></p>
        </td>
    </tr>
    <tr>
        <td width="165" style="border: none; padding: 0in">
            <p><a href="Purchase.html">Purchase</a></p>
        </td>
    </tr>
    <tr>
        <td width="165" style="border: none; padding: 0in">
            <p><a href="Physics.html">Physics</a></p>
        </td>
    </tr>
    <tr>
        <td width="165" style="border: none; padding: 0in">
            <p><a href="Media.html">Media</a></p>
        </td>
    </tr>
    <tr>
        <td width="165" style="border: none; padding: 0in">
            <p><a href="Games.html">Games</a></p>
        </td>
    </tr>
    <tr>
        <td width="165" style="border: none; padding: 0in">
            <p><a href="Contact.html">Contact</a></p>
        </td>
    </tr>
    <tr>
        <td width="165" style="border: none; padding: 0in">
            <p><a href="Developement.html">In The Works</a></p>
        </td>
    </tr>
</table>
        </div>
        </div>
</body>
<div id="contentliquid"><div id="contentwrap">
        <div id="content">
  <h1>Rocket Toy</h1>
  <p>Is your child interested in space? Want to get your child more
interested in Science? Is your child naturally good with math, and
want to learn Physics? 
  <p style="margin-bottom: 0in" fontSize=150%>With the new Odyssey, your child can
explore space from the safety of you living room!</p>
  </div></div></p></div></ br></ br>
  <div id="footerwrap">
        <div id="footer">
  <hr>
<p style="margin-bottom: 0in"><a href="../Odyssey%20Webpage">About the Toy</a>&nbsp;&nbsp;|&nbsp;&nbsp;
<a href="../Odyssey%20Webpage">Buy Now!</a>&nbsp;&nbsp;|&nbsp;&nbsp;
<a href="../Odyssey%20Webpage">Contact</a>&nbsp;&nbsp;|&nbsp;&nbsp;
<a href="../Odyssey%20Webpage">Developement</a>&nbsp;&nbsp;|&nbsp;&nbsp;
<a href="../Odyssey%20Webpage">Physics</a>&nbsp;&nbsp;|&nbsp;&nbsp;
<a href="../Odyssey%20Webpage">Press</a>&nbsp;&nbsp;|&nbsp;&nbsp;
<a href="../Odyssey%20Webpage">Games</a>&nbsp;&nbsp;|&nbsp;&nbsp;
</p>
<hr>
 </div>
</div>
<p><font size="2" color="white" style="font-size: 10pt"><b>©2014<br><a href="Contact.html">
Bobst, Murphy Troy Co.</a><!-- More Graphics (shows toy, space, awards)Logo
Promotion
 ---></b></font></p>

</html>

CSS /* 由http://www.cssportal.com 生成 */

@import url("reset.css");

body {
    font-family: Verdana, Arial, Helvetica, sans-serif;
    font-size: 13px;
    background-image:url('space-background.jpg');
}

p {
    padding: 10px;
}

#wrapper {
    margin: 0 auto;
    width: 1200px;
}
a:link {
    color: #56BAEC; 
    text-decoration: underline; /* unless you style your links to look extremely unique, it's best to provide underlines for quick visual identification */
}
a:visited {
    color: #FFEC94;
    text-decoration: underline;
}
a:hover, a:active, a:focus { /* this group of selectors will give a keyboard navigator the same hover experience as the person using a mouse. */
    text-decoration: none;
}
#headerwrap {
    width: 1200px;
    float: left;
    margin: 0 auto;
}

#header {
    margin: 5px;
}

#contentwrap {
    width: 1000px;
    float: left;
    margin: 0 auto;
}

#content {
    background: #4227AB;
    border-radius: 10px;
    border: 1px solid #2e1397;
    margin: 3px;
    min-height:250px
}

#leftcolumnwrap {
    width: 200px;
    float: left;
    margin: 0 auto;
    max-height:220px
}

#leftcolumn {
    background: #3A41A6;
    border-radius: 5px;
    border: 1px solid #262d92;
    margin: 5px;
}

#footerwrap {
    width: 1200px;
    float: left;
    margin: 0 auto;
    clear: both;
}

#footer {
    background: 5C33FF;
    border-radius: 10px;
    border: 1px solid #481feb;
    margin: 5px;
}

我想知道您是否可以帮助解决它。我不擅长 CSS，我从网站上得到了代码

【问题讨论】：

标签： html css web

【解决方案1】：

这不是很好的代码，所以我建议你让开发人员参与进来。无论如何，只需在您的 CSS 中删除这一行：

#leftcolumnwrap {
    max-height: 220px;
}

【讨论】：