UIKit v3 sticky element inside modal?

Question

I want to have a uk-sticky element inside of a uk-modal-full modal, but it does not behave with sticky behavior. As I scroll down the modal, the element scrolls off the screen.

<div uk-modal="bg-close: false" class="uk-modal-full">
    <div class="uk-modal-dialog uk-modal-body">
        <button class="uk-modal-close-full" uk-close></button>
        <h2 class="uk-modal-title">Modal Title</h2>
        <div uk-sticky>
            <!-- Sticky content here. -->
        </div>
        <div>
           <!-- Other content here. -->
        </div>
    </div>
</div>

I have also tried using the bottom: true option.

<div uk-modal="bg-close: false" class="uk-modal-full">
    <div class="uk-modal-dialog uk-modal-body">
        <button class="uk-modal-close-full" uk-close></button>
        <h2 class="uk-modal-title">Modal Title</h2>
        <div uk-sticky="bottom: true">
            <!-- Sticky content here. -->
        </div>
        <div>
           <!-- Other content here. -->
        </div>
    </div>
</div>

Is it possible to have a sticky element inside of a modal with UIKit?

UPDATE:

I tested out having a uk-sticky element directly within the uk-modal div and worked.

<div uk-modal="bg-close: false" class="uk-modal-full">
    <div uk-sticky>
        <h1>Testing Sticky</h1>
    </div>
    <div class="uk-modal-dialog uk-modal-body">
        <button class="uk-modal-close-full" uk-close></button>
        <h2 class="uk-modal-title">Modal Title</h2>
        <div uk-sticky>
            <!-- Sticky content here. -->
        </div>
        <div>
           <!-- Other content here. -->
        </div>
    </div>
</div>

However, this is not exactly what I need because I need the content to be within the inner div with the class uk-modal-dialog uk-modal-full; otherwise, there is no padding or margin and it doesn't look good.

Answer 1

In the end, I ended up with a kind of undesirable solution, but it works.

<div uk-modal="bg-close: false" class="uk-modal-full">
    <!-- .app-modal-sticky-header is a class I had to use -->
    <!-- in order to apply the background color obtained -->
    <!-- from .uk-modal-dialog. -->
    <div class="uk-modal-body app-modal-sticky-header" uk-sticky>
        <button class="uk-modal-close-full" uk-close></button>
        <h2 class="uk-modal-title">Modal Title</h2>
        <!-- Sticky content here. -->
    </div>
    <div class="uk-modal-dialog uk-modal-body">
        <!-- Scrollable content here. -->
    </div>
</div>