2012-08-11 6 views
2

아래 레이아웃에서 div1div2을 같은 행에 입력하고 다음 행 (div1 미만)으로 div3을 옮기고 싶습니다. 미리 감사드립니다.div를 다음 행으로 강제 할 수있는 방법

<html> 
<body> 
<div style="width:50%;"> 
    <div id="div1" style="float:left; 
            background-color:red; 
            vertical-align: bottom;"> 
     <label> This is my label</label><br> 
     <input type ="text"> 
    </div> 
    <div id="div2" style="padding-left:10px; 
            padding-right:0px; 
            float:left; 
            background-color:green; 
            vertical-align: bottom;"> 
     <label> &nbsp;</label><br> 
     <button id="btn" >My button</button> 
    </div> 
    <div id="div3" style="background-color:yellow;">This is error</div> 
</div> 
</body> 

답변

5

사용 <br style="clear: both;">

<html> 
<body> 
<div style="width:50%;"> 
    <div id="div1" style="float:left; background-color:red; vertical-align: bottom;"> 
     <label> This is my label</label><br> 
     <input type ="text"> 
    </div> 
    <div id="div2" style="padding-left:10px;padding-right:0px;float:left; background-color:green; vertical-align: bottom;"> 
     <label> &nbsp;</label><br> 
     <button id="btn" >My button</button> 
    </div> 

    <br style="clear: both;"> 

    <div id="div3" style="background-color:yellow; float:none" >This is error</div> 
</div> 
</body>​​​​​​ 

jsFiddle

+0

감사합니다 @ 피터. 완벽하게 일했습니다. – Rocky

관련 문제