sctrojanfan504
New member
My background image code is not displaying by background image in FireFox nor Chrome. I don't know about IE because I am using a Mac, but nonetheless, it should work. I am using an external style sheet. If I use the background image code in the HTML documents header, then it works, but using it in the CSS file does not. I want it to work in the external file. My css file is liked to my html file correctly because it displays all the other styles just not the background image.
Here is my HTML code:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<title> </title>
<link rel="stylesheet" type="text/css" href="css/style.css" />
</head>
<body>
<div id="wrapper">
hello
</div>
</body>
</html>
Here is my CSS code:
body
{
}
#wrapper
{
background-image: url("topBg.png");
background-repeat: repeat-x;
height: 100px;
border: solid 1px black;
}
The image displays if I put it directly in the HTML code using:
<img src="topBg.png" alt="background image" />
But this code is not for a background image just the image itself.
Here is my HTML code:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<title> </title>
<link rel="stylesheet" type="text/css" href="css/style.css" />
</head>
<body>
<div id="wrapper">
hello
</div>
</body>
</html>
Here is my CSS code:
body
{
}
#wrapper
{
background-image: url("topBg.png");
background-repeat: repeat-x;
height: 100px;
border: solid 1px black;
}
The image displays if I put it directly in the HTML code using:
<img src="topBg.png" alt="background image" />
But this code is not for a background image just the image itself.