根據內容在不同列的相同高度製作兩個div

-1

我有兩個Foundation列，其中有兩個div，每個div都有文本。兩種文本不具有相同的長度，這也就是爲什麼，在申報單並不總是相同的高度（取決於媒體查詢）根據內容在不同列的相同高度製作兩個div

<div class="row"> 
    <div class="medium-10 columns"> 
    <p>Some text here</p> 
    </div> 

    <div class="medium-10 columns> 
    <p>A lot more text in here</p> 
    </div> 
</div>

我想要做的是，這兩個div的始終是相同的高度（根據其中大部分文字的div）。此外，我想將文本居中放置在文本較少的div內。我一直用Flexbox來做這件事。但由於基礎網格佈局而崩潰。任何想法？

僅限CSS！

來源

2015-09-28 supersize

嘗試jQuery matchHeight：http://brm.io/jquery-match-height/ –

我使用了完全相同的問題標題，將其輸入到Google中，並找到了一百萬種實現您的目標的不同方法。如果你的問題不同，請解釋。 –

no javascript！只有CSS – supersize

從基礎DOC：

您可以使用一些數據屬性的高度相等的容器。將數據均衡器屬性應用於父容器。然後將數據均衡器監視屬性應用於您希望具有相同高度的每個元素。數據均衡器監視屬性的高度將爲等於最高元素的高度。

<div class="row" data-equalizer> 
    <div class="large-6 columns panel" data-equalizer-watch> 
    ... 
    </div> 
    <div class="large-6 columns panel" data-equalizer-watch> 
    ... 
    </div> 
</div>

Foundation Doc

來源

2015-09-28 20:20:45 TOho

您可以隨時使用display：您.row類表，並顯示：在你列的表芯。無論內容如何，表格單元格都會強制兩個div的高度相同。

來源

2015-09-28 21:00:09

根據內容在不同列的相同高度製作兩個div

回答

相關問題