How to define padding of ion-content in Sass

Dear All,

I’m aware that Ionic provides some CSS utilites with attributes to define the padding of the ion-content within the template, e.g. in page.html you could have following line to apply padding to the top:
<ion-content padding-top>

However, I would like to define the content padding in my Sass sheet, e.g. in page.html I would have:
And in my page.scss I would define:

.content {
   padding-top: 16px;

I was assuming that this would give me the same result as using the Ionic CSS utility attribute, however with this approach the padding gets ignored, i.e. the content has no padding at all.

Can somebody explain me why this second approach of defining the content padding in the Sass file does not work?

Thanks in advance.


Any updates on this?


Something like…

page-home {
        padding-top: 100px;

Ok, so you need to define it as part of the scroll-content style. Perfect, thanks a lot.