Home/ Questions/Q 8364757
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-06-09T12:30:05+00:00

In the layout below, I would like div1 and div2 to in the same

  • 0

In the layout below, I would like div1 and div2 to in the same row, but move div3 in next row (below div1). Thanks in advance.

<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>

Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    Use <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