我正在使用Dreamweaver爲類創建任務。我保存了我的CSS文件,回到我的主頁,我的頁面的主要內容被拉下來了,但是我的頁腳留下了「內容」div空白,無法使用。可能是一個基本問題,但我不確定我的錯誤在哪裏。爲什麼我的內容在頁面上向下移動?
@charset "utf-8";
body {
\t background-color: #D3D3D3;
\t margin: 0px;
\t padding: 0px; \t
}
a {
\t \t text-decoration: none;
}
a:link {
\t \t color:#39c;
\t \t outline: none;
}
a:visited {
\t \t color:#39c;
\t \t outline: none;
}
a:hover {
\t \t color: #000080;
\t \t outline: none;
}
a:active {
\t \t outline: none;
\t \t -moz-user-focus: none;
}
h1 {
\t \t font-family:"Trebuchet MS", Arial, Helvetica, sans-serif;
\t \t font-size:28px;
\t \t font-weight:700;
\t \t color: #333;
\t \t margin: 0px;
\t \t padding: 0px; \t \t
}
p {
\t margin: 0px;
\t padding: 0px;
\t text-align: left;
}
ul {
\t list-style-type: none; \t
}
.wrapper {
\t width: 1020px;
\t min-height: 800px;
\t margin-right: auto;
\t margin-left: auto;
\t background-image: url(images/bg_wrapper.jpg);
\t background-repeat: repeat-x;
\t background-color: #fbf3f3;
}
#header {
\t width: 1020px;
\t height: 241px;
\t background-image:url(images/logo.png);
\t background-repeat:no-repeat;
\t align: center;
}
#nav {
\t font-family: "Arial Black", Gadget, sans-serif;
\t width: 1020px;
\t height: 75px;
\t background-color: #B8110B;
\t display: inline-block;
\t text-align: center;
\t margin: auto;
}
#nav li {
\t display: inline-block;
\t list-style-type: none;
}
#nav ul {
\t padding: 10px;
}
#nav ul li a {
\t font-family: Constantia, "Lucida Bright", "DejaVu Serif", Georgia, serif;
\t color: #F4E9E9;
\t text-decoration: none;
\t background-color: #B8110B;
\t padding-top: 3px;
\t padding-right: 5px;
\t padding-bottom: 3px;
\t padding-left: 5px;
\t display: inline-block;
\t font-weight: bold;
}
#nav ul li a:hover {
\t display: block;
\t height: 30px;
\t background-color: #c6403b;
\t border: medium solid #87031B;
}
#container {
\t width: 1020px;
\t height: 800px;
\t align: center;
}
#footer {
\t width: 1020px;
\t min-height: 100px;
\t background-color: #0b3162;
}
#sidebar {
\t float: left;
\t margin-right: 10px;
\t margin-top: 20px;
\t width: 250px;
\t height: 405px;
\t \t
}
#sidebar1 {
\t float: right;
\t margin-right: 10px;
\t margin-top: 20px;
\t width: 250px;
\t height: 405px;
\t \t
}
#middle {
\t overflow: hidden;
\t text-align: center;
}
#content {
\t margin-left: 10px;
\t background-color: white;
\t width: 1020px;
\t height: 800px;
\t align: center;
}
.sidebartextleft {
\t font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
\t font-size: 20px;
\t font-weight: 700;
\t color: ##000000;
\t line-height: 2em;
}
.navtext {
\t text-align: center;
\t font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
\t text-align: center;
\t padding-top: 5px;
\t padding-bottom: 50px;
\t font-size: 15px;
\t font-weight: 700;
\t color: #600;
\t line-height: 1em;
}
.txtmain {
\t \t text-align: justify;
\t \t font-family:"Trebuchet MS", Arial, Helvetica, sans-serif;
\t \t font-size: 14px;
\t \t color: #333;
\t \t line-height: 1.5em;
\t \t padding-right: 30px;
\t \t padding-top: 20px;
}
.txtsub {
\t \t text-align: center;
\t \t font-family:"Trebuchet MS", Arial, Helvetica, sans-serif;
\t \t font-size: 10px;
\t \t color: #CCC;
\t \t padding-top: 10px;
}
.clear {
\t \t clear: both; \t
}
.wrapper #header .imgleft {
\t text-align: right;
}
.h1header {
\t font-family: Arial, Helvetica, sans-serif;
\t font-size: 24px;
\t font-style: normal;
\t font-weight: bold;
\t color: #03C;
\t margin-top: 5px;
\t text-align: center;
}
.h1sidebar {
\t font-family: Arial, Helvetica, sans-serif;
\t font-size: 18px;
\t font-style: normal;
\t font-weight: bold;
\t color: #af1216;
\t margin-top: 5px;
\t margin-left: 5px;
\t text-align: left;
}
.h1sidebarleft {
\t font-family: Arial, Helvetica, sans-serif;
\t font-size: 18px;
\t font-style: normal;
\t font-weight: bold;
\t color: #a9a9a9;
\t margin-top: 5px;
\t margin-left: 15px;
\t text-align: left;
}
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>TAKE IN LONDON</title>
<link href="styles.css" rel="stylesheet" type="text/css" />
</head>
<body>
<div class="wrapper">
<div id="header">
<p><img name="Londonlogo" src="images/Londonlogo.jpg" width="1020" height="241" alt="TAKE IN LONDON logo"></p>
</div>
<div id="nav">
<ul>
<li><a href="index.html">Home</a></li>
<li><a href="activites.html">Things To Do </a></li>
<li><a href="contactus.html">Contact Us</a></li>
</ul></div>
<div id="container">
<div id="content">
<p class="txtmain"><img name="LondonNight" src="images/LondonSkyline.jpg" width="995" height="300" alt="London Skyline At Night"></p>
<div class="h1header"> Welcome to TAKE IN LONDON Travel Agency</div>
. </div>
<div id="sidebar">
\t <ul>
\t <li class="navlinks"><a href="index.html">HOME</a></li>
<li class="navlinks"><a href="location.html">LOCATION</a></li>
<li class="navlinks"><a href="contact.html">CONTACT</a></li>
</ul>
<div id="middle"></div>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p class="txtmain">Founded in </p>
</div>
</div>
</div>
<div id="footer">
<p class="txtsub"> Copyright © 2015, TAKE IN LONDON Travel | All rights reserved.</p>
</div>
</div>
</body>
</html>
請幫我
請在您的問題中發佈您的代碼。 – j08691
創建你的演示[here](http://www.jsfiddle.net)。 – divy3993
據我在這裏可以看到:http://jsfiddle.net/9ste8yog/,它是你的頁眉圖像,推下頁面。 –