Soldaki şamandırayı nasıl durdurabilirim?

Takip koduna sahibim:

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

Benim sorunum, class adm ile div'in sola kayması ve böylece etiket ve iki giriş düğmesiyle aynı satırda gitmesi. Bu değişimi yüzmekten uzaklaştırmanın bir yolu var mı?

Standart bir yaklaşım, iki yüzen blok seviyesi öğesi arasına bir takas bölümü eklemektir:

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

Bazen netlik işe yaramaz. float: noneGeçersiz kılma olarak kullan

Değiştirebilir .admve ekleyebilirsiniz

.adm{
 clear:both;
}

Bu onu yeni bir çizgiye taşımalı

style="clear:both;""adm" e ekleyin div.

Tamam, cevabın ilk DIV'den kalan ilk şamandırayı kaldırmak olduğunu fark ettim. Bunu daha önce neden görmediğimi bilmiyorum.

Bir kayan noktayı kaldırmak bir seçenek değilse, css'deki "clear" özelliğini de kontrol etmelisiniz.

clear: leftAdm sınıfınızdaki css , üzerindeki öğelerle birlikte yüzen div'i durdurmalıdır.

Sadece overflow:hiddenilk divstili ekleyin . O kadarı yeterli olacaktır.

Bazı nedenlerden dolayı yukarıdaki düzeltmelerin hiçbiri benim için işe yaramadı (aynı sorunu yaşadım), ancak bu:

Bir div öğesi içinde süzülüyor elemanların tümü koyarak deneyin: <div class="row">...</div>.

Ardından bu CCS'yi ekleyin: .row::after {content: ""; clear: both; display: table;}

Önyüklemede bunun için bir sınıf var

class="clearfix";