html - position:absolute reduces height -

.header2  {     background-color:#cdd1cd;      padding: 15px 0;  }    .header1   {      background-color: #60db60;  	padding: 10px 0;  }  form  {    position: absolute    }

<div class="headers header1" id="header1">  	    <div class="logo"></div>  		<div class="slogan"></div>  	 </div>  	   	 <div class="headers header2" id="header2">  	     <form>  		    <table>  			   <tr>  			     <td>email or mobile number</td>  				 <td>password</td>  			   </tr>  			   <tr>  			      <td><input type="text"></input></td>  				  <td><input type="password"></input></td>  			   </tr>  			   <tr>  			      <td>  				  </td>  			      <td><a>forgot password?</a></td>  			   </tr>  			</table>  		 </form>  	 </div>

i tried add overflow:hidden , misplacing guess. provide me best way floats form right?

position: absolute; right: 0 

does this. height problem still exists.

i don't wish set height or add float.

provide me best way floats form right?

so don't use position: absolute, use actual float: right , apply kind of clearfix (for example, overflow: auto) parent container:

.header2 {     background-color:#cdd1cd;     padding: 15px 0;     overflow: auto; } form {     float: right;    } 

check demo below.

.header2 {      background-color:#cdd1cd;      padding: 15px 0;      overflow: auto;  }  .header1 {      background-color: #60db60;      padding: 10px 0;  }  form {      float: right;     }

<div class="headers header1" id="header1">      <div class="logo"></div>      <div class="slogan"></div>  </div>  <div class="headers header2" id="header2">      <form>          <table>              <tr>                  <td>email or mobile number</td>                  <td>password</td>              </tr>              <tr>                  <td>                      <input type="text"></input>                  </td>                  <td>                      <input type="password"></input>                  </td>              </tr>              <tr>                  <td></td>                  <td><a>forgot password?</a>                    </td>              </tr>          </table>      </form>  </div>