如何停止向左浮动？

98

我有以下代码：

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

我的问题是类adm的div浮动到左侧，因此与label和两个输入按钮位于同一行。有什么方法可以使我从浮动转变呢？

css html css-float

— 托尼·G
source

即使是您自己的，您也应该接受答案。

— DᴀʀᴛʜVᴀᴅᴇʀ

101

一种标准方法是在两个浮动块级元素之间添加清除div：

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

— d
source

3

但在某些情况下，您需要添加display:block

— Volodymyr Levytskyi 2014年

64

有时清除将不起作用。使用float: none作为覆盖

— 丹·科迪
source

3

是的，如果您想覆盖现有的CSS条目float: left（或正确的），那么这就是解决方案。

— Alexis Wilke

28

您可以修改.adm并添加

.adm{
 clear:both;
}

那应该使它移到新的一行

— 布雷特
source

那应该是.adm我的想法。

— tjm 2011年

9

添加style="clear:both;"到“ adm” div。

— j
source

4

好吧，我刚刚意识到答案是从第一个DIV中删除第一个浮点数。不知道为什么我以前没看到过。

— 托尼·G
source

3

您还应该在CSS中签出“ clear”属性，以防无法删除浮点数

— 特雷
source

3

clear: leftadm类中的CSS 应该使div随其上方的元素停止浮动。

— 克里斯·肯特
source

0

只需添加overflow:hidden第一种div样式即可。那应该足够了。

— 阳光明媚
source

0

由于某种原因，以上修复都不对我有用（我有同样的问题），但是确实可以：

尝试将所有浮动元素放入div元素：中 <div class="row">...</div>。

然后添加此CCS： .row::after {content: ""; clear: both; display: table;}

— 依斯哥
source