# Work around for sticky inside child component

**URL:** <https://forum.ionicframework.com/t/work-around-for-sticky-inside-child-component/100885>\
**Category:** ionic-v3\
**Created:** [August 4, 2017, 3:52pm UTC](https://forum.ionicframework.com/t/work-around-for-sticky-inside-child-component/100885 "2017-08-04T15:52:23Z")\
**Posts on this page:** 1\
**Page:** 1

<div class="post-metadata">

**Author:** ![ghostrunners](https://sea1.discourse-cdn.com/ionicframework/user_avatar/forum.ionicframework.com/ghostrunners/32/109290_2.png) [@ghostrunners](https://forum.ionicframework.com/u/ghostrunners)\
**Post date:** [August 4, 2017, 3:52pm UTC](https://forum.ionicframework.com/t/work-around-for-sticky-inside-child-component/100885/1 "2017-08-04T15:52:23Z")

</div>

I’m trying to have some grand total in a sticky sitting atop the page. The problem is that the child component sits outside the scope of the scrolling container.

Here’s a partial of the parent -

```auto
<ion-content>
    <ion-grid text-center>
        <sticky-totals [total]="totals" sticky></sticky-totals>

```

Here’s the child or sticky component -

```auto
<ion-item-divider sticky>
    <h2>Estimated Total Cost <span class="float-right">{{ total | currency:'USD':true }}</span></h2>
    <ion-icon item-right name="refresh" (click)="refreshPage()"></ion-icon>
</ion-item-divider>

```

I want to reuse this component across multiple pages - any idea on how to make ui elements branched out in child components behave under a single dom?