我试图创建一个 HTML 页面,但内容仅从左侧导航栏完成的位置下方开始。我正试图让 twi 并排排列。我试过浮动内容,但到目前为止没有运气
这是我的CSS,非常感谢任何帮助
body
{
margin: 0;
padding: 0;
font-family: arial, verdana, sans-serif;
color: #000;
background-color: #0099CC;
background-image: url(../Images/Background.jpg);
}
#banner
{
background-color: #87CEFA;
border-bottom: 1px solid #333;
text-align: center;
}
#banner h1
{
margin: 0;
padding: .5em;
}
#container
{
margin: 1em 5%;
background-color: #E0FFFF;
background-image: url(../Images/bluebackground.jpg);
background-repeat: repeat-y;
}
#content
{
padding-top: 0.5em;
margin: 0 2em 0 200px;
padding-bottom: 0.5em;
float:left;
}
#navigation {float:left; font-size:0.75em; width:178px; }
#navigation ul {margin:0px; padding:0px;}
#navigation li {list-style: none;}
ul.top-level { background:#1E90FF; }
ul.top-level li {
border-bottom: #fff solid;
border-top: #fff solid;
border-width: 1.5px;
}
#navigation a {
color: #fff;
cursor: pointer;
display:block;
height:25px;
line-height: 25px;
text-indent: 10px;
text-decoration:none;
width:100%;
}
#navigation a:hover{
text-decoration:underline;
}
#navigation li:hover {
background: #f90;
position: relative;
}
ul.sub-level {
display: none;
}
li:hover .sub-level {
background: #0000CD;
border: #fff solid;
border-width: 1px;
display: block;
position: absolute;
left: 168px;
top: 0px;
}
ul.sub-level li {
border: none;
float:left;
width:150px;
}
#nav p
{
margin-top: 0;
}
#footer
{
clear: both;
background-color: #78CEFA;
padding: 1em;
text-align: center;
border-top: 1px solid #333;
font-size:1em;
}