處理內聯塊網格＆字體大小在CSS

當使用內聯塊元件A維護的方法，所述元件周圍的空白真拋出了使用它的網格元件。由於空白，50％的兩個元素不能坐在一起。處理內聯塊網格＆字體大小在CSS

這個最好的解決辦法是做喜歡的事：

.column { 
     display: inline-block; 
     vertical-align: top; 
    } 

    .grid { 
     font-size: 0; 

     > * { 
      font-size: initial; 
     } 
    } 

    <div class="grid"> 
     <div class="column w50"></div> 
     <div class="column w50"></div> 
    </div>

然而，導致事情改變類型的大小（用EMS大小類型時）和那些明星選擇是在一點點皺起了眉頭。

刪除HTML中的空白是不是一個真正的選擇，它需要從維護方面走其他開發者需要知道，以確保空白被刪除，它不是那麼可讀。同樣的評論技巧。

在一個理想的世界，我只希望用柔性但IE9仍然是一個事。

我能得到過的明星選擇，如果我可以做一些事情，不改變子元素的字體大小。

編輯： 我瞭解有關於如何處理白色空間類似的問題，但是這是專門關於周圍的字體大小問題的方法。有一些技巧來修復空白，但上述可能是最好的，因爲它不像評論/負面保證金那樣不好。

來源

2015-11-04 evu

這個問題是不是太廣，意見基礎或邀請討論，所以是題外話堆棧溢出 –

我d建議使用bootstrap。您可以設置將並排坐在一起的列，並且它也具有響應性。 –

@Paulie_D我不同意。但也許有人問過。 – HerrSerker

當您使用font-size:0方法來對付inline-block差距，因爲你是擔心font-size:initial爲孩子（一個或多個）由於使用的ems：

然而，導致事情的變化型尺寸（與 EMS上漿時類型）和那些明星選擇是在一點點皺起了眉頭。

您可以通過使用REM，而不是「解決」這一點。

看到REM，EM和PX下面之間的差異：

Comprehensive Guide: When to Use Em vs. Rem

Confused About REM and EM?

雖然EM是相對於字體大小其直銷T或最近的父， REM僅僅是相對於HTML（根）font-size

來源

2015-11-09 03:39:13 dippas

本週末正在研究一些問題，並以rems爲解決方案:)唯一的問題是將它用於IE9中的僞元素，並將它用於速記字體poperties，而我從來沒有這樣做無論如何。應該足夠安全。這種技術使構建網格系統幾乎和flex一樣好。如果我們可以正確地浮動並保持內聯塊狀態:)乾杯。 – evu

處理內聯塊網格＆字體大小在CSS

回答

相關問題