你好，我遇到了一个与页面底部相关的问题。出现了一些原因导致页脚无法正确对齐，我不确定问题出在哪里。这是应该显示的样子 (https://imgur.com/Bmvfbrx)，但实际上它看起来像这样 (https://imgur.com/vY1kPTH)。请告诉我我做错了什么，非常感谢。另外，我在验证器中没有发现任何错误。
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<link rel="stylesheet" href="cyclestyle.css">
<title>Cycling Tours</title>
</head>
<body>
<div id="container">
<section id="header">
<header>
<nav>
<ul>
<li><a href="aboutus.html">About us</a></li>
<li><a href="a" title="Ask Us">Ask Us</a></li>
<li><a href="a" title="Destination">Destination</a></li>
<li><a href="a" title="FAQ">FAQ</a></li>
<li><a href="a" title="Reviews">Reviews</a></li>
<li><a href="a" title="Seminars">Reviews</a></li>
<li><a href="a" title="Trip Prep">Trip Prep</a></li>
</ul>
</nav>
<h1>Cycling Tours</h1>
<figure>
<img id="banner" src="images/cycling_banner.png" alt="cycling">
</figure>
</header>
</section>
<section id="aboutus">
<h3> About Us </h3>
<p> Cycling Tours began when Bill Randolf and three of his friends from high school began to cycle regularly every weekend. Their routine cycling evolved into frequent cycling trips and they cultivated a following. Before they knew it, other friends and family members asked to join them in their trips.</p>
<img src = "images/cyclists.jpeg" alt="cyclists" class = "floatright">
<p>Cyclists are enthusiastic and very health and environmentally conscious. For this reason, all of our trips include vegan options for meals, recycled paper food serving utensils, and hybrid vehicles to escort the cyclists.</p>
<p>Our trips are suitable for solo cyclists, couples, friends, and families. We provide camping accommodation for off-road cycling trips, and shared accommodations for couples, friends and families. If you are travelling solo, we can match you with someone for shared accommodations. You can also pay the single-supplement if you wish to have a room of your own.</p>
<p>After you've completed one trip with us, we're sure you'll want to do more. Over 80% of our customers have been on at least one prior trip with us. We're always looking for new ideas for trips, so please let us know if you have any ideas!</p>
</section>
<section id="tripinfo">
<h3>Trip Information</h3>
<br>
<p>Our trips are planned carefully to provide the best experience for cyclists.</p>
<br>
<p>Types of trips include self-contained camping tours, inn-to-inn tours and other adventure cycling.</p>
</section>
<footer>
<div id = "footer">
<hr>
<hr>
<p>Cycling Tours✻ P.O. Box 4455✻ Brantford,ON✻ N3T 2J0 <br> Image Credit: http://www.bikelink.com/images/banner01.jpg </p>
</div>
</footer>
</div>
</body>
</html>
cyclestyle.css
* {
margin: 0;
padding: 0;
}
body {
height:90vh;
}
p {
text-indent: 50px;
line-height:1.5em;
}
#tripinfo {
background-color:#bbccdd;
float:right;
width:20%;
height:68.5vh;
}
header {
}
#banner {
width:100%;
}
nav {
list-style-type: none;
text-align: center;
text-decoration: none;
}
nav li {
display: inline ;
}
#container {
width: 1000px;
margin: 20px auto;
}
* {
box-sizing: border-box;
}
nav a{
border: 2px solid black;
padding: 8px;
border-radius:10px 10px 0px 10px;
text-decoration:none;
background-color:#bbccdd;
color:white;
font-family: verdana;
font-weight:bold;
}
a:hover {
color: black;
}
#aboutus {
float:left;
width:80%;
height:80vh;
}
h1 {
position:absolute;
font-family:Verdana;
color:White;
font-size:3.5em;
}
h3 {
font-family:Verdana;
}
p {
font-family:Verdana;
font-size:.90em;
}
#footer {
text-align:centre;
font-weight:bold;
}
#container {
width: 1000px;
}
