Can't correctly nest grids.

[adriansalvatori]

This is about Bulma | A Bug.

Overview of the problem

This is about the Bulma CSS framework
I'm using Bulma 1.0.0
My browser is: Chrome / Edge

Description

When placing a grid inside another one, it'll asume the column-count of the parent one.
For example, I have a 3 cols grid, and inside, every child-item should also have a grid of 2 cols, these child-items will have 3 cols, not 2.

Steps to Reproduce

Write something like this.

<div class="fixed-grid has-3-cols">
    <div class="grid">
        <div class="cell">
            <div class="fixed-grid has-2-cols">
                <div class="grid">
                    <!-- This grid will not have 2 cols, but 3 --!>
                    <div class="cell">
                       <div class="title is-4">{{ $title }}</div>
                    </div>
                </div>
            </div>
        </div>
        <div class="cell">
        </div>
        <div class="cell">
        </div>
    </div>
</div>

Expected behavior

Nested grids should respect the column count of its immediate parent

[Ijee]

I am also facing this problem and it isn't even a direct parent div but way further down in the DOM.

Did you manage to solve this somehow or do we have to wait for an update and use a normal css grid in the meantime?