Many thanks, its now working correctly… But just one more question… My app now fits the whole iphone x screen, but my apps colour is red and now at the top of the screen is, just below the notch, its white, if you get me… How can i change that part from white to red so it fills the top part?

Many Thanks

Hi i have updated my app using the code below (added it to /www/lib/onsen/css/onsenui-core.css) Is there some other code i need to add as well as cant seem to find it

}
html[onsflag-iphonex-landscape] ons-splitter-side[side=“right”] .page__content > .list:not(.list–inset) > .list-header {
padding-left: 15px;
}
html[onsflag-iphonex-landscape] ons-splitter-side[side=“right”] .page__content > .list:not(.list–inset) > .list-item {
padding-left: 14px;
}

/* Suppress right safe area support for pages in left splitter sides */
html[onsflag-iphonex-landscape] ons-splitter-side[side=“left”] .page__content > .list:not(.list–inset) {
margin-right: 0;
}
html[onsflag-iphonex-landscape] ons-splitter-side[side=“left”] .page__content > .list:not(.list–inset) > .list-item–chevron:before {
right: 16px;
}
html[onsflag-iphonex-landscape] ons-splitter-side[side=“left”] .page__content > .list:not(.list–inset) > .list-item > .list-item__center:last-child {
padding-right: 6px;
}
html[onsflag-iphonex-landscape] ons-splitter-side[side=“left”] .page__content > .list:not(.list–inset) > .list-item > .list-item__right {
padding-right: 12px;
}
html[onsflag-iphonex-landscape] ons-splitter-side[side=“left”] .page__content > .list:not(.list–inset) > .list-item > .list-item–chevron__right {
padding-right: 30px;
}
}

but when i build and run the app on my own iPhone X, the screen is just the same as the normal iphone (black bar at the top and the bottom). What else do I need to add to make the app full screen on the iPhone X?