如何細分4列YUI grid.css佈局中的列？

Question

我有一個YUI網格，給了我4不平列：

<div class="yui-gc"> 
    <div class="yui-gd first"> 
     <div class="yui-u first">Reason</div> 
     <div class="yui-u">Scope</div> 
    </div> 
    <div class="yui-g"> 
     <div class="yui-u first">Related</div> 
     <div class="yui-u">Product</div> 
    </div> 
    </div> 

下面，我想有5列，額外的一個破裂的範圍列2/3，1/3的到來。我能得到的最接近的是1/2，下1/2範圍：

<div class="yui-gc"> 
    <div class="yui-gd first"> 
     <div class="yui-u first">reasons</div> 
     <div class="yui-g"> <!-- split Scope column --> 
     <div class="yui-u first">questions</div> 
     <div class="yui-u">answers</div> 
     </div> 
    </div> 
    <div class="yui-g"> 
     <div class="yui-u first">stuff</div> 
     <div class="yui-u">products</div> 
    </div> 
    </div> 

好像改變DIV標記<!-- split Scope column -->到<div class="yui-gc">應該做的伎倆，但事實並非如此。

我缺少什麼？

Answer 1

因爲我相信你已經試過了，你的div的.yui-g應該是.yui-gc。它也需要被包裹在一個yui-u中或者除了yui-gc之外還有一個yui-u類。然而，yui的css文件在這一點上自行跳出。 .yui-gd div.first規則位於src中的.yui-gc div.first規則之後，並將其破壞。結果是，列按1/3，2/3排列，而不是2/3，1/3。

最簡單的（如哈克，因爲它可能會）的方式來解決將只是放在一個inline聲明把列寬回到它們應該在哪裏。

<div class="yui-gc"> 
<div class="yui-gd first"> 
    <div class="yui-u first">reasons</div> 
    <div class="yui-u yui-gc"> 
     <div class="yui-u first" style="width: 66%;">questions</div> 
     <div class="yui-u" style="width: 32%;">answers</div> 
    </div> 
</div> 

<div class="yui-u yui-g"> 
    <div class="yui-u first">Related</div> 
    <div class="yui-u">Product</div> 
</div>