关于 div 嵌套,该如何解决

关于 div 嵌套

我用chrome查看，<div class="list_manager_top5_in"> margin的上边5px，怎么在<div class="list_manager_top5_out">外边了？

不是应该包含在里边的吗，求解？

    <div class="list_manager_top5_out">

        <div class="list_manager_top5_in">

            <div >

                <div></div>

                <div></div>

                <div></div>

                <div></div>

            </div>

            <div >

                <div></div>

                <div></div>

                <div></div>

            </div>

        </div>

    </div>

.list_manager_top5_out

{

    width:100%;

    clear:both;

    height: 100px; 

    background-color: #E4ECF5;

    }

    

 .list_manager_top5_in

{

    padding:5px 0 0 25px;

    margin:5px;

    clear:both;

    border:1px solid black;

    }   

------解决方案--------------------
估计是浏览器兼容性问题，我用谷歌和火狐测试的时候都是一样情况，IE就显示正常。
这个问题发生的原因是嵌套内的第一个块元素设置了margin-top；
这样这个块元素就会破开它的父元素（我也不知道是不是破开，反正意思你懂就行），这样就把它的父元素整个往下顶。
兼容性修补：使用父元素设置padding-top替代第一个子元素的margin-top;
就是这样：

    .list_manager_top5_out

   {

    width:100%;

    clear:both;

    height: 100px; 

    background-color: #E4ECF5;

    (padding-top:5px;)

    }

     

    .list_manager_top5_in

   {

    padding:5px 0 0 25px;

    margin:5px;

    clear:both;

    border:1px solid black;

    (margin-top:0;)

    }