Skip to Content

Archived discussions are read-only. Learn more about SAP Q&A

Problem faced in using image in sapui5

Hi Guys,

I am new to ui5 sorry for noob question.I searched all post before posting here.Help me build my first complete app using ui5.

I have following few questions related to setting image in ui5

<Image src="images/logo.png">


  • For the background of the login page i had set image via style now the problem is the image is fit exact its been cut or stretched how to make complete image fit exactly in the space?.Also is it possible to make the background image resolution responsive to different size window?


       Existing issue


       wanted like this


  • I am using a splitapp but its not having the to bring the background shade.also it is possible to change it to some image background? I am using XML view


        splitapp i am using with no background shade


         splitapp with background shade.




Former Member
Former Member replied

Hi Deepan

1.     Move the images folder inside WebContent folder to make it accessible.

2.     To make the background image fit exactly to the screen, please use this CSS

.loginPageDiv {

     background-size: 100% 100%;


3.     Please apply following style to the app for the background shade

body {

     background-image: -webkit-gradient(linear,left top,left bottom,color-stop(0%,#2da9b1),color-stop(50%,#178299),color-stop(100%,#1a4c7d)) !important;   

     background-image: -webkit-linear-gradient(top,#2da9b1 0,#178299 50%,#1a4c7d 100%) !important;

     background-image: -ms-linear-gradient(top,#2da9b1 0,#178299 50%,#1a4c7d 100%) !important;

     background-image: linear-gradient(to bottom,#2da9b1 0,#178299 50%,#1a4c7d 100%) !important;


#content {

     max-width: 1280px !important;


Hope this solves your problem.



1 View this answer in context

Helpful Answer

Not what you were looking for? View more on this topic or Ask a question