Click to See Complete Forum and Search --> : background image


imperial
08-18-2006, 11:40 PM
Hi,
my background image (100x100) wont work both on IE and FF, i dont know why :(

HTML
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Untitled Document</title>
<link href="css/comersus.css" type="text/css" rel="stylesheet"/>
</head>

<body>
<div id="bgimage" ><div id="mainwrapper">main content</div></div>
</body>
</html>

CSS
div#bgimage {background:url(images/background.gif) repeat-y; width:100%; height:50px; border: 1px solid #666666; margin:5px;}
div#mainwrapper { border: 1px solid #666666; margin:auto; margin-top:15px; width:776px;}

shritesh
08-19-2006, 12:12 AM
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<style>
#bgimage {background:url(images/background.jpg) repeat-y; width:100%; height:500px; border: 1px solid #666666; margin:5px;}
#mainwrapper { border: 1px solid #666666; margin:auto; margin-top:15px; width:776px;}

</style>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Untitled Document</title>
<link href="css/comersus.css" type="text/css" rel="stylesheet"/>
</head>

<body>
<div id="bgimage" ><div id="mainwrapper">main content</div></div>
</body>
</html>

Please check the above code... and see that the background file is in the images directory where the current file recides in which the css file is included.

hope this will help u

Shritesh

imperial
08-19-2006, 01:03 AM
Please check the above code... and see that the background file is in the images directory where the current file recides in which the css file is included.

hope this will help u

Shritesh

Hi shritesh,

yes my files are in its proper place, just like what you did above using an internal stylesheet it works but when I use the external location it wont work. The external one is what I want in which I still couldnt get. Thanks anyways shritesh thanks!

Sheldon
08-19-2006, 02:21 AM
I will tell you why it ony works internally as you have it.

Because your CSS is in the folder /css/
so you are telling it to look for the images in /css/images/
you need to add this "../" to your paths in the external sheet.

EG:
div#bgimage {background:url(../images/background.gif) ..........


This will tell the server to look for the images in the folder before this page, then in the images folder.

../ == go up one directory
./ == work from this directory

imperial
08-19-2006, 05:42 AM
my oh my, I miss that part! what can I say? Thank you Sheldon!