內聯塊可識別白色空間，實際內容和堆棧的自動寬度按它們在HTML中的順序排列。浮動不是，但需要clearfix方法，並基於塊元素。這些元素在可用空間上水平地具有自動寬度。純粹的語義上來說，內聯塊的語義較少，因爲空白感知格式和順序的重要性。但純粹以功能性的方式來看，它們都不是爲了網格而製作的。如果不是用於僞CSS，那麼我們也會有非語義的HTML標籤clearfixe。所以我相信他們都不是贏家。但在未來幾年flexbox將成爲強制性的時候，目前沒有其他選擇。
隨着直列塊：
<div>
<div style="display:inline-block; width:30%;">col1
</div><div style="display:inline-block; width:70%;">col2</div>
</div>
標籤必須被粘合在一起/所附，以關閉任何溝。容器div是強制項目成爲單獨行的一部分所必需的。
花車：
<div class="clearfix">
<div style="float:left; width:30%;">col1</div>
<div style="float:left; width:70%;">col2</div>
</div>
Clearfix是必要的強制「行」（解僱任何正常流量項目問題或浮動後浮）
無論使用一個或另一個的問題你的目標（和品味）。我必須說，只要你知道兩個寬度或者使用相對大小（％），我就喜歡內聯塊以上的浮動。我認爲它比浮動更直觀，更可預測，可以解決問題，如果它被應用程序使用，甚至不會出現問題。只有內聯塊的空白區域意識迫使你使用一些時髦的html ，這是一個缺點
具有諷刺意味的是，表格完全沒有任何問題（甚至是柱高和垂直對齊），因爲內嵌塊必須按順序排列，所以這裏有一個討論動機。
如果我們正在討論響應式，表內聯塊的表「丟失」。假設你在桌面上有4列，並且你想在平板電腦上使用2列，在移動設備上使用1列。通過嵌入塊，您只需給出其他寬度尺寸，並且希望包裹好（在倒塌時注意邊距）。使用表格，你必然會遇到實際的行，這些行很固定。 Flexbox需要很長時間，看起來很漂亮。您可以在某些情況下靈活調整佈局。
我用Bootstrap，但厭倦了他們缺乏給予人們的信用和他們的態度。但是，瞭解他們如何做某事可能會很方便。剛剛閱讀3.0他們正在使用相對網格大小。這給嵌套網格和對齊提出了問題。
---- --a- ---- ----
---b------
.... ..c.
Col a是正常的母校。 Col c是b的小孩嵌套。除非你使用填充和邊界框模型，否則很難將c與相對大小對齊，因爲對於容器而言，排水溝是可變的。但這樣你就失去了很多靈活性。當你想讓col有一些背景和填充時，你就搞亂了網格系統，所以你必須使用你的風格的容器，這會混淆代碼。我還沒有研究過他們是否找到了解決辦法。我還沒有。我去了固定像素，但這意味着在響應式設計中，您只能擁有幾個固定寬度，並且對於移動設備中的所有內容都使用相對網格。
感謝您的回答，但您確定意味着img是內聯元素，p是塊級元素，反之亦然，不是嗎？:) – orustammanapov
實際上，'img'和'p'都是塊級別元素。我糾正了答案。 – Mojtaba
對不起，我的錯誤是它沒有內聯元素，也沒有塊級元素。 ** img **標籤默認爲**內聯塊**。您可以像塊級元素一樣定義寬度和高度，但也可以與同一行上的其他元素內聯，而不會浮動。 – orustammanapov