基線斷線問題

Question

我有一個基礎框架網格，我在一行中設置了2列。我正在經歷從第一列到下一列的不必要的換行。該問題存在於「大」屏幕尺寸上。第一列是「大-2」，第二列是「大-4大中心」，出於某種原因，第二列中的圖像似乎低於第一列h2元素的換行符，而不是應該如此。除非另有說明，每列的內容當然應該與行的頂部對齊？

Here's the codepen

Answer 1

您需要從第二列中刪除「大中心」類的「換行」消失，或把第二列在自己的行。每行只能有一個CENTERED列，請參閱Grid docs。

<div class="row"> 
    <div class="small-3 small-centered columns">3 centered</div> 
</div> 
<div class="row"> 
    <div class="small-6 large-centered columns">6 centered</div> 
</div> 
<div class="row"> 
    <div class="small-9 small-centered large-uncentered columns">9 centered</div> 
</div> 
<div class="row"> 
    <div class="small-11 small-centered columns">11 centered</div> 
</div>