3

I'm trying to make an image the background of my Visualforce page. I've tried every single way I can think of to reference the image from static resources. I've created a zip file with both the image and the .css file and reference it from my apex page. Can someone who has successfully made an image a background share their code with me? I need step by step directions please, as I've tried using everyone else's ideas and tips from this page and other pages I've googled and it's simply not working. I have an image (StayConnected.jpg) and a .css file (style.css) zipped into a file called 'Image.zip'. I've uploaded that zip file to Static Resources and have named it 'Image'. I can change the background color in the .css but I can't simply make the background an image. I've been going at this for about a week now and I'm desperate for help.

The following is the code that isn't working.

.CSS file:

.table
{ 


background-image: url("Image/StayConnected.jpg");
position: relative;
}  

APEX page:

apex:stylesheet value="{!URLFOR($Resource.Image, 'Image/style.css')}"/

thank you for your help and consideration!

  • Please update your question to include the relevant code that's not functional. – sfdcfox Jun 30 '14 at 16:07
3

Change url("Image/StayConnected.jpg"); to

url("{!URLFOR($Resource.Image, 'Image/StayConnected.jpg')}");
1

Thank you all for your replies! I was able to figure out the issue. When I was zipping the folders (css and image folders) together I dropped them into a main folder and then zipped that folder, instead of selecting both the css and image folder and zipping it from there. It messed up my file paths when calling the static resource. Thanks again!

  • Please mark an answer as correct- even if it is your own answer - so that the question can be closed. – DavidSchach Jul 11 '14 at 2:13
0

It appears that the CSS and image file are in the same folder, based on your code, so it should probably not need the directory prefix in the CSS file.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.