與HTML/CSS相同的行高

Question

我一個網站，設計者已要求在首頁下面的格式上工作多列：

News  Notices Events 
Item 1 Item 1 Item 1 
Blurb Blurb Blurb 
Blurb    Blurb 
Blurb 

Item 2 Item 2 Item 2 
Blurb Blurb Blurb 
Blurb Blurb 
     Blurb 

的想法是，每個項目應該是相同的水平高度。我可以很容易地通過以下方式div的做到這一點：

<div class="row"> 
    <div>News</div> 
    <div>Notices</div> 
    <div>Events</div> 
</div> 
<div class="row"> 
    <div>Item 1</div> 
    <div>Item 1</div> 
    <div>Item 1</div> 
</div> 
<div class="row"> 
    <div>Item 2</div> 
    <div>Item 2</div> 
    <div>Item 2</div> 
</div> 

然而，這不是很大的信息架構 - 尤其是因爲我想堆的新聞，對於小/窄/手機屏幕通知和活動列。

無論如何我可以得到設計師想要的結果但仍保留正確的信息架構？

更新

使用jQuery重新調整在頁面加載網格後，我展示了設計師。一旦他意識到我們很少控制用戶放入CMS的內容，並且網格中的內容將失去平衡，他就完成了整個想法。

所以我不需要這個答案，但我會保持它的好奇心。

Answer 1

看看下面的內容。應該給你一些想法：

http://spyrestudios.com/css-grid-systems/