Removing space between ion-header and ion-content

Hi all, any idea on how to remove the white spacing in between ADDITIONAL MATHEMATICS and C1:INTRODUCTION TO PHYSICS?

My source code:

Have you inspect the screen? Maybe, there is a margin or padding between ADDITIONAL MATHEMATICS and C1:INTRODUCTION TO PHYSICS and you can change it.

Sorry this may sound dumb, but how do I inspect the screen?

It is not dumb.
On the page you show in the posted image, next to the button to see the app like in a device, there is a button with an arrow. If you click in it, you can click on screen and watch and work with their css properties.
Other option, in the same page, is to click on Element tab. In element tab you can search the elements and watch and work with their css properties.

Any issues?

That’s the inspection page I am refering to. Now you have to search in that inspection page your elements and watch if there are margins and/or paddings between elements. You can also click on the elements you want to inspect and analize their css properties.
I think you can find your elements inside app-root.


Any news? Do you resolve it?

Hi! Unfortunately, no :frowning: Everything was alright and kinda clueless on this.

Ca you provide a Repository, that i can reproduce the error?

Sure! I am going to work now, I will post it later, thanksss for offering to help :slight_smile:

Not to throw a massive wet blanket on this party, but ISTR that @YXUN has been describing this potential app as something intended to be distributed on app stores. Given what I see in this thread, I think the potential for rejection is substantial, and may warrant a rather fundamental rethinking of the design and perhaps of the viability of the entire project.

Websites served in an iOS app, web content that is not formatted for iOS, and limited web interactions do not make a quality app.
– Apple App Store Guidelines, “Avoiding Common App Rejections”

Using an iframe will get you app rejected by the app store and is not recommended
– Ionic team member @mhartington

1 Like

Noted, any idea on implement notes? It’s a app full of notes, there’s no way I can type it out on html tag and it’s going to be so huge, and Google sheets is the way where I can store the notes. Any alternatives?

If that’s literally all it is, then maybe it would just make more sense to make it as a PWA, because I don’t see it getting approved by app stores. Do you have plans for features that really seem mobile-app-like and couldn’t easily be implemented as a website?

I’ve implemented a subset of the functionality of these forums here in an Ionic client before, using Markdown as the source format, so I know that’s doable (and, incidentally, without any need for either <iframe>s or InAppBrowser. There appear to be Google Docs to Markdown trancoders available, so maybe you could look into that.

Okay will look into it, what if I add some native features into my ionic4 (e.g. a form?) Will that help eliminate the chances that it is only just a WEB APP?

Maybe we have different notions of what “a form” means, because websites definitely have forms. I’m typing into one right now.

Perhaps it would be fruitful for you to immerse yourself a bit in PWA documentation and think about whether this structure / distribution strategy might make the most sense for you. Conversely, while learning about what PWAs can do might also unlock some ideas you may have for things that PWAs can’t do that you would like to implement in the project.

Circling back to the topic at hand, I am super-bearish on iframes in general, and very skeptical that you will be able to achieve much control over layout at all as long as you’re using one, let alone on this particular issue of unwanted spacing. Google Docs does not strike me as a viable backend for Ionic apps, but you don’t have to take my word for it: if Google thought it was, would Firebase exist?