我正在处理的网站存在问题，正确的包装器一直下降到网站下方。显然我希望它留在右手边。
我编写了一个测试用例，它显示了我的问题(我认为)，我想知道是否有更好的方法来做事。
网址是http://www.musicworkshop.co.nz/
下面是测试用例(我认为)是导致我的问题的原因，但也可能不是。如果不适合页面宽度，粉红色框会掉落。
我还附上了我正在尝试实现的目标的图表以及正确包装器的屏幕截图，而不是它应该在的位置。
有更好的方法吗？
约翰
<html>
<head>
<title> Test page </title>
<link rel="stylesheet" href="test.css" type="text/css" />
</head>
<body>
<div id="superbox">
<div id="box1">
</div>
<div id="box2">
</div>
<div id="box3">
</div>
<div id="box4">
</div>
<div id="box5">
</div>
<div id="box6">
</div>
</div>
</body>
</html>
#superbox{
width: 1000px;
height: 100px;
margin: 0 auto;
}
#box1{
height: 100px;
width: 200px;
background: red;
float: left;
}
#box2{
height: 100px;
width: 200px;
background: yellow;
float: left;
}
#box3{
height: 100px;
width: 200px;
background: blue;
float: left;
}
#box4{
height: 100px;
width: 200px;
background: green;
float: left;
}
#box5{
height: 100px;
width: 200px;
background: grey;
float: left;
}
#box6{
height: 100px;
width: 200px;
background: pink;
float: left;
}
alt text http://www.musicworkshop.co.nz/website.png
alt text http://www.musicworkshop.co.nz/website_right-wrap-missing.png
最佳答案
由于您所有的框都是 200 像素宽，所以请选择 %。
关于CSS:右包装器从页面末尾掉落，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/3051164/