Background-image not working in external stylesheet

swornavidhya_m

I'm trying to create a tableless website. When using external stylesheet, the background-image property alone is not working with my external stylesheet. Other properties are working fine with the external stylesheet. I'm getting fuzzed to continue. My external stylesheet (style.css) and is placed in folder 'css' code is: The image is in folder 'images'. When surfng the google with 'background-image not working in external stylesheet' i found that if we place css in different folder and made a call for an image in differnt folder we've to give mention as

background-image:url("../images/disdat-gold-red.gif");

- even this failed. Again when searched, i found that instead of saying 'background-image' give code as follows for which they answered it worked fine. And the code is:

background: #000000 url(images/disdat-gold-red.gif) repeat-x;

- even this get failed for me. I'm attaching my html file along with my css file. Coding part in "style.css" #header { text-align:center; font-family:arial, verdana, 'times new roman'; font-size:15pt; font-weight:bold; color:#0ac0af; padding:2% 0 15% 0; background:url(images/disdat-gold-red.gif) no-repeat; } HTML code is: <html> <head> <meta name="GENERATOR" content="Microsoft FrontPage 6.0"> <meta name="ProgId" content="FrontPage.Editor.Document"> <meta http-equiv="Content-Type" content="text/html; charset=windows-1252"> <title>Try Web Page</title> <link type=text/css rel=stylesheet href=css/style.css> </head> <body> <div id="container"> <div id="top"> <div id="header">Inside Header Top Container</div> <div id="nav">Inside Nav Top Container</div> </div> <div id="main"> <div id="left">Inside Left Main Container</div> <div id="right">Inside Right Main Container</div> </div> <div id="footer">Inside footer Container</div> </div> </body> </html>

M.Sworna Vidhya

Lost User

I tried your code it is working here fine at my end. Keep the images in image folder. Keep style sheet file in css folder. Both of these folders (image and css) should be at the same level of your folder hierarchy. Now when you are referring image file try to refer it as follows.

background-image:url("../images/disdat-gold-red.gif");

HTH

Jinal Desai - LIVE Experience is mother of sage....

T M Gray

Make all of your references relative to the root (start with /). Or use a base tag.

swornavidhya_m

Thank you, desai. Now it works for me.

Lost User

My Pleasure.

Jinal Desai - LIVE Experience is mother of sage....