Search code examples
single-sign-onibm-cloud

Why is my background-image not displayed when uploaded to bluemix single sign on?


Bluemix SSO provides the ability to download a zip file containing the html and style.css files to enable users to customize their pages. This is great! However I can't seem to get it to work. I updated the proper login.html and the equivalent style.css file. It displays properly in my browser, but when I upload the files back to bluemix SSO, the page info and setup shows up as expected but the background jpg image is not there.

snipt from my style.css:

body {
  width: 90%;
  margin: 0;
  padding: 0;
  background-image: url('./my.jpg');
  background-repeat: no-repeat;
  background-attachment: fixed;
  background-position: center;
}

Is there a specific place we need to put these files? I've tried: * background-image: url('./my.jpg'); * background-image: url(my.jpg); * background-image: url(/mtfim/sps/static/my.jpg); -- /mtfim/sps/static is the location where the html seem to be picking up the style.css file

I'm out of ideas, thanks!


Solution

  • In general, and not only with Bluemix, if you need to understand where to put an image or a generic resource for a web page to load it through the web browser, the best and quickest way is to use the developer tool from Chrome/Firefox/IE and check the URL used by the browser to fetch the resource using the network panel or the inspection one: by this way you have immediately the path where the browser looks for the resource and you habe simply to put the image here.

    From your first CSS you are referring a jpg placed in the same path of the CSS.