How to put a background image in coldfusion page?

Report · Nov 11, 2010

Hi all,

I have created number of coldfusion pages,i would like to have a background image for them either unique or different images.

So i have created a style.css and added a line for background image like

background-image: url(/images/nature.jpg);

But it doesn't works.

Even i tried this by giving in head section of all my cfm pages but it doesn't work.

Also i have used

<head>
     <style type="text/css">
          html {overflow-y:hidden;}
          body {overflow-y:auto;}
          #page-background {position:absolute; z-index:-1;}
          #content {position:static;padding:10px;}
     </style>
</head>

<body>
     <div id="page-background"><img src="images/sri.jpg" alt="Smile"></div>
         <div id="content">
              This is body content
         </div>
</body>

but the alt value 'smile' only appearing not the image.

I'm working on CFBuilder.

Both firefox and IE not displaying the image

Any help appreciated,

Chandru P

Report · Nov 11, 2010

If it is inside the cfoutput tags, then u may need to double the "#" symbol.

Report · Nov 11, 2010

The fact that this is in a CF template is neither here nor there (other than the caveat about # as the other person said).

All CF does is generate mark-up. The mark-up is sent to the browser, and the browser renders it. So if your browser isn't rendering your image assets, it's because it can't find them.

I suspect your URLs are wrong. Are you getting 404s for the image URLs?

One thing to bear in mind is that URLs to resources are not relative to the CFM template they're in, they're relative to the URL the client requested, which are not necessarily (indeed very infrequently ~) the same.

--

Adam

Report · Nov 11, 2010

I agree with Adam!. Just check your image property (by right clicking it) in your browser and check if the path is correct.

HTH