html - 将一个 div 排列在另一个下方

Question

我有两个内部 div，它们嵌套在包装 div 中。我想让两个内部 div 一个一个地排列在另一个下面。但截至目前，他们被安排在同一条线上。

#wrapper{
        margin-left:auto;
        margin-right:auto;
        height:auto; 
        width:auto;
    }
    #inner1{
        float:left; 
    }
    #inner2{
        float:left; 
    } 
 

  <div id="wrapper">
        <div id="inner1">This is inner div 1</div>
        <div id="inner2">This is inner div 2</div>
    </div>

Answer 1

尝试清除:留在#inner2 上。因为它们都被设置为 float ，所以应该导致行返回。

#inner1 {
   float:left; 
}

#inner2{
   float:left; 
   clear: left;
}

<div id="wrapper">
    <div id="inner1">This is inner div 1</div>
    <div id="inner2">This is inner div 2</div>
</div>