How can I stop float left?

TonyG picture TonyG · Jun 1, 2011 · Viewed 142.1k times · Source

I have the following code:

<div style="float: left; width: 100%;">
  <label style="float: left;">ABC</label>  
  <input style="float: left; font-size: 0.5em;" type="button"   onclick="addTiny(0,'Question_Text'); return false;" value="&#x25BC;" title="Editor" />   
  <input style="float: left; font-size: 0.5em;" type="button" onclick="remTiny(0,'Question_Text'); return false;" value="&#x25B2;" title="Hide" />   

  <div class="adm">
    <textarea rows="2;" style="width: 100%" class="text-box multi-line mceEditor">
      abc
    </textarea>
  </div>
</div>

My problem is that the div with class adm floats to the left and so goes on the same line as the label and two input buttons. Is there a way that I can make this shift away from floating?

Answer

Shad picture Shad · Jun 1, 2011

A standard approach is to add a clearing div between the two floating block level elements:

<div style="clear:both;"></div>