Skip to Content
Nov 13, 2019 at 06:17 AM

How to set application width to 100% in version 1.65

1418 Views Last edit Nov 13, 2019 at 06:46 AM 2 rev

Hello Experts,

I'm using version 1.65 of SAPUI5.

In older versions when I wanted to set width of the app to 100% I set the appWidthLimited property of the Shell component to false.

                sap.ui.getCore().attachInit(function() {
                    new sap.m.Shell({
                        appWidthLimited : false,
                        app: new sap.ui.core.ComponentContainer({
                            height : "100%",
                            name : "creditreport"

In the newer version Shell is no longer part of the index.html, there is only html which looks like this:

<body class="sapUiBody orlPersonalExpenses">
            data-settings='{"id" : "PersonalExpenses"}'>

I searched in the DOM and found the 'sapMShellCentralBox', then I used CSS in order to change it

            .orlPersonalExpenses .sapMShellCentralBox {
                width: 100% !important;
                margin-right: 0px !important;
                right: 0 !important;

Is there an API to set width to 100%? as we all know CSS hacks will eventually come back to bite you in the a*s (-: