我知道这个问题已经被一遍又一遍地回答,但我找不到适合我的东西。我认为这与内容或侧边栏中缺少 display: 属性有关,但我不确定是什么。请看一下我的代码,看看是否能发现我的错误。
我很抱歉问这个问题,我确信有一些明显的答案,但我还没有发现它。
提前致谢
安迪
<html>
<head>
<title>Andy's test website</title>
<style type="text/css">
html, body
{
margin:0px;
padding:0px;
}
p
{
margin:0px;
padding:0px;
}
#container
{
margin:0 auto;
background-color:white;
width:760px;
border:1px solid gray;
}
#header
{
line-height:130%;
border-bottom:1px solid gray;
width:760px;
}
#content
{
float: left;
width:500px;
margin-right:260px;
}
#sidebar
{
float: right;
width:260px;
}
#footer
{
clear:both;
width:760px;
}
</style>
</head>
<body>
<div id="container">
<div id="header">
<h1>Hello World</h1>
</div>
<div id="content">
<p>
"Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod
tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam,
quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo
consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse
cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non
proident, sunt in culpa qui officia deserunt mollit anim id est laborum."
</p>
</div>
<div id='sidebar'>
<p>
"Lorem ipsum dolor sit amet, consectetur adipisicing elit,
sed do eiusmod tempor incididunt ut labore et dolore
magna aliqua. Ut enim ad minim veniam,"
</p>
</div>
<div id="footer">
footer
</div>
</div>
</body>
</html>
最佳答案
使用此 CSS
#content
{
float: left;
width:480px;
margin-right:20px;
}
#sidebar
{
float: left;
width:260px;
}
两个元素都应向左浮动,第一个元素将具有右侧边距。
关于html - 让两个 div 彼此相邻 float 时遇到一些问题,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/7464051/