什麼CSS使東西去頁面的下一行？

如何使元素自動定位在頁面中的新行上？在HTML中，我可以使用<br>，但是如何在CSS中添加類似換行符的內容？什麼CSS使東西去頁面的下一行？

說我有例如下面的代碼：

<p>Lorem ipsum dolor sit amet, 
    <span id="elementId">consectetur adipisicing elit.</span> 
    Magni totam velit ex delectus fuga fugit</p>

跨度仍定位在同一行作爲文本的其餘部分。如何純粹通過CSS將新文本移動到新行上？

<div class="smalldiv">Lorem ipsum dolor sit amet</div> 
<div class="smalldiv">Lorem ipsum dolor sit amet</div> 
<div class="smalldiv" id="elementId">Lorem ipsum dolor sit amet</div> 
<div class="smalldiv">Lorem ipsum dolor sit amet</div> 

.smalldiv { 
    display: inline-block; // OR 
    float: left; 
}

我如何可以移動<div> S的一個上一個新的行創建一個新的行：

又如使用display: inline-block或float時是什麼？

來源

2011-04-03 Justin Meltzer

...我想我不同意你;什麼是'什麼'？ – 2011-04-03 07:40:34

你有沒有打擾過去看？除非你的問題比大衛認爲的更復雜。 – 2011-04-03 07:40:37

可能重複[麻煩定位div下面幾個浮動左div]（http://stackoverflow.com/questions/5414321/trouble-positioning-div-below-several-float-left-divs） – js1568 2012-08-16 20:29:25

有跡象表明，我能想到的兩個選項，但沒有更多的細節，我不能肯定哪個是更好的：

#elementId { 
    display: block; 
}

這將元力，以「新線」如果它與浮動元素不在同一行。

#elementId { 
    clear: both; 
}

這將強制元素清除浮動，並移動到「新行」。

在該元件爲在同一行的另一個具有position的fixed或absolute什麼都不會，所以據我所知，強制的情況下，「新線」，這些元件是從文檔的正常流動去除。

來源

2011-04-03 07:41:51

有趣的是，這是一個非常糟糕的問題，但谷歌仍然把它作爲第一次打擊，這正是什麼我在尋找，答案也是如此。 – neminem 2013-05-29 21:23:17

如果父元素是內聯元素，那麼情況如何。如果是這種情況，這似乎不起作用。 – bflemi3 2015-01-07 22:09:58

這取決於爲什麼東西是在同一條線上擺在首位。

在花車的情況下clear，display: block在在線內容中自然流淌，沒有什麼會擊敗position: absolute作爲前一個元素的情況下會被它取出來的正常流動。

來源

2011-04-03 07:41:24 Quentin

...忘了'
' – 2011-04-03 07:43:45

@安德魯：'br'是* not * css。 – 2011-04-03 07:45:38

@大衛，哈，哎呀'：['太遲了，可能是一個睡覺的標誌...... – 2011-04-03 07:47:21

有元素顯示爲塊：

display: block;

來源

2011-04-03 07:42:43

什麼CSS使東西去頁面的下一行？

回答

相關問題