位置/溢出/浮动css和div

<html> 
<head> 

<style type="text/css"> 

.parent 
{ 
    width: auto; 
    height: auto; 
    min-width: 600px; 
    min-height: 600px; 
    border: 1px dashed #f00; 
    padding: 5px; 
    overflow: auto; 
    position: absolute; 
} 

.child 
{ 
    width : 100px; 
    height: 500px; 
    border: 1px solid #0f0; 
    float: left; 
    position: relative; 
} 
.second_child 
{ 
    width : 1800px; 
    height: 100px; 
    border: 1px solid black; 
    float: left; 
    position:relative; 
} 
</script> 

</style> 

</head> 

<body style="overflow:auto"> 

<div class="parent"> 
    <div class="child"> 
    </div> 
    <div class="second_child"> 
    </div> 
</div> 
</body> 
</html>

我想把两个盒子放在一个更大的盒子里。如果我将第二个框的宽度扩大到大于窗口的宽度，我现在就可以正常工作了。您的屏幕示例为1024x720，第二个框的宽度为1800px，第二个框在第一个框的下方重新定位。我只是好奇它为什么这样做，而不是把一个滚动条，并保持对象的位置。位置/溢出/浮动css和div

我说错了，还是我以错误的方式思考这个问题。我几乎试图用一张桌子作为布局来尝试这一点，但这对我来说似乎是非常直观的。

来源

2012-10-11 Thao Nguyen