我有这个示例 html
<html>
<head>
<style type="text/css">
.div-menu
{
width:300px;
margin-left:20px;
margin-right:20px;
float:left;
border:thin solid;
min-height:600px;
height:auto;
}
.div-content
{
float:left;
min-width:700px;
width:auto;
border:thin solid;
min-height:600px;
height:auto;
padding-right:20px;
}
</style>
</head>
<body>
<div style="margin-top:50px;padding:10px;">
<div class="div-menu">
</div>
<div class="div-content">
<div id='main' style="width:2000px;background-color:lightblue;height:600px">
Hello world
</div>
</div>
</div>
</body>
</html>
当div main的实际宽度大于页面宽度时,div-contain被分解到div-menu的底部,我想让那个div保持在div-menu的旁边,并且窗口水平滚动条会出现,
我怎样才能实现
感谢任何建议
谢谢
最佳答案
改变这一行
<div style="margin-top:50px;padding:10px;">
到
<div style="width:2364px; margin-top:50px;padding:10px;">
指定宽度等于div-menu和div-content的有效宽度之和
在这种情况下,宽度应为 2364px
这是通过找到 div_width + margin_widths + padding_widths + border_widths 的总和来计算的
(300+20+20+2)+(2000+20+2)=2364
关于html - CSS float 溢出,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/8381748/