[Ionic 4]Beta 12: Styling of "inner-scroll"-div


Hey everyone,

i’ve developed a simple application with the beginning of beta.0. Everything is now working and i upgraded lately to Beta 12. It’s all fine, except, that the has now a shadow-dom with a

inside of it.

This inner-scroll was had a transparent background in beta.0. Now it is white (the color is defined in a -Tag in the shadow-root). I tried to set the sass-variable and the color directly with sass (including all kinds of selectors which should give me the shadow-root).

What can i do now to get this inner-scroll transparent or at least give it a background-image?
Thank you in advance
Kind regards


Have you tried:

/deep/ .css-class-name-of-your-inner-scroll {

I don’t understand your response… could you provide an other example more detailed…? I’ve also had the same problem as @patrick_schnell, I need place a card inside in an inner-scroll in the middle of a page… I had read that one possible solution would be overwrite .inner-scroll styles as

justify-content: center;
align-items: center;

But I am not able to do so in the right way.



I wanna change the position att of .inner-scroll but this don’t work:

ion-content .inner-scroll {
   position: inherit !important;

The fixed styles make it really hard to integrate this lib.

I already make some advances in some points, after spend many hours. It should not to be so complicate change this but, well…

<ion-router-outlet style="contain: inherit !important;overflow: inherit !important;"></ion-router-outlet>

.ion-page {
  contain: inherit !important;
  overflow: inherit !important;