Don't work if content is not first child of container

[stephane-r]

Hi,

Do you know if the content is not first child of container can be work ?

My layout :

<div id="js-off-canvas-wrapper" class="off-canvas-wrapper">

    <div id="js-off-canvas-wrapper-inner" class="off-canvas-wrapper-inner" data-off-canvas-wrapper>

        {{> navigationMobile}}

        <div id="js-header-sticky" class="header-sticky">
            {{> header}}
        </div>

        <div id="js-container" class="l-container  transitions-container">
            <main id="js-content" class="block-grid l-content" role="main" itemprop="mainContentOfPage">

                {{#if currentPageIs 'home'}}
                {{> visual}}
                {{else}}
                {{> titlePageContainer}}
                {{/if}}

                <div class="row padding-row small-4 {{ layout.rowClass }}">

                    {{> yield}}

                </div>

            </main>

            {{> footer}}

        </div>

        <div class="js-off-canvas-exit">Fermer la navigation mobile</div>
        <div class="reveal-modal" data-reveal aria-labelledby="modalTitle" aria-hidden="true" role="dialog"></div>

    </div>
</div>

[jamielob]

It makes it harder to get a predictable response from the CSS that way but you should at the inline transition example.

[stephane-r]

I think the problem is too on inline transition : container and first child content

[jamielob]

You have to wrap the element you want to transition with a container no matter what. Otherwise it won't know where to make the transition.