如何在列中嵌套列？

Question

我正在使用Semantic UI，在尝试将<div>分开时，我可以使用这些元素（如下面的屏幕截图所示）：

以下是代码：

<div class="ui four column grid">

<div class="column">

    <div class="ui segment">

        <div class="ui top left attached label">Saturday</div>

        <div class="ui two column grid">
            <div class="column">
                <div class="two column"><i class="sunn"></i><i class="cloud"></i></div>

            </div>
            <div class="column">
                <div class="ui statistic">
                    <div class="label">Sun raises</div>
                    <div class="value">06:46</div>
                </div>
            </div>
        </div>
    </div>
</div>

这是一个分叉：

http://jsfiddle.net/0djhjpym/