I am trying to use 2 background images but can't seem to figure out how to get them to work simultaneously within my Fancybox.
The first one is a textured background which is already in place.
The second is a small corner icon that I need to place flush in the upper left-hand corner.
I tried examples that I found online, but none of them seem to work.
Here's the test page I'm working with:
Here's the CSS code that holds the first background image:
background: url("http://online.saintleo.edu/FancyBox2/cleanpaper_squaretile.png") repeat scroll 0 0 transparent;
border-radius: 4px 4px 4px 4px;
And here is the second background image that I need to incorporate (upper left corner snippet)
As always, thank you in advance for your patience, time and assistance.
CSS3 is the best option but older browsers may not support it. However, you could add this css at the top of your head section to see if this works for you:
<style type="text/css" media="all">
Basically, what I am doing is to add the background to the body of your page to place the image at the top left corner while your style for the DIV takes care of the second background image.
For completeness, the CSS3 method is here: