在下面的例子中，我试图让div“左”和“右”并排显示。显然我的理解有缺陷，但我犯了什么错误，因为（至少在Chrome中）它们并没有并排出现。
谢谢
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<style type="text/css" media="screen">
body {
margin: 0;
padding: 0;
background: #ffffff;
text-align:center;
}
#container {
margin: 100px auto 100px auto;
padding: 0;
background: #eeeeee;
text-align:left;
width: 49.5em;
}
#title {
margin: 2em;
padding: 0;
background: dddddd;
width: 49.5em;
}
#graphics {
margin: 0;
padding: 0;
height:200px;
background: #cccccc;
width: 49.5em;
}
#navigation {
margin: 0;
padding: 0;
background: #bbbbbb;
height:3em;
width: 49.5em;
}
#wrapper {
margin: 0;
padding: 0;
background: #aaaaaa;
width: 49.5em;
}
#left, #right {
margin: 0;
padding: 0;
float: left;
background: #999999;
width: 41em;
}
#right {
margin: 1.5em 0 0 0.5em;
padding: 0;
float: right;
background: #888888;
width: 8em;
}
.clear {
margin: 0;
padding: 0;
height: 0;
font-size: 1px;
line-height: 0;
clear: both;
}
</style>
</head>
<body>
<div id="container">
<div id="title">Title</div>
<div id="graphics">Graphics</div>
<div id="menu">Menu Item</div>
<div id="wrapper">
<div id="left">
Left
</div>
<div id="right">
Right
</div>
<div class="clear">
</div>
</div>
</div>
</body>
</html>
最佳答案
问题是您在#right上指定了1.5em的边距。把它拿出来，应该能用。这里有一个working jsfiddle。
关于css - CSS并排Divs，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/7558928/