index.php

<!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=utf-8" />
<title>Masterlink International</title>
</head>
<link href="frontpage.css" rel="stylesheet" type="style/css" />



<div id="body">
<body>
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Mauris consectetur nunc quis orci feugiat a semper lectus interdum. Aliquam ipsum metus, mollis sed commodo nec, blandit nec tortor. Nulla eget massa sem. Nullam cursus libero eu massa consectetur et fringilla lectus sodales. Ut tempor, eros vel consequat convallis, erat nulla convallis ipsum, id rutrum ipsum ante eget leo. Vivamus hendrerit auctor tortor ut dapibus. In nec lorem diam, hendrerit pretium diam. Nulla varius porta congue. 
</body>

</div>

</html>

Hey, I wonder why background's image does not appears


frontpage.css

@charset "utf-8";
/* CSS Document */

body {
	background-image: url(Background.jpg);
}

The link is correct but I cannot see my background image in IE. I can see it in my Dreamweaver.

Dani AI

Generated

Most likely causes: the external stylesheet is not being loaded by IE (bad link tag or incorrect HTML structure), or the image path in the CSS is being resolved relative to the CSS file (so the same URL works inline but not from frontpage.css). was right to flag the markup: a stray element before <body> and a misplaced <link> can confuse browsers. ’s note about quotes/semicolons is fine but not the root cause here; ’s idea of an images folder is useful — just be careful with relative paths.

Fixes to try (in order): make the HTML valid and put the stylesheet link inside the <head> using the correct MIME type; open the CSS file directly in the browser to confirm it loads; use IE’s developer tools (F12) Network/Console to spot 404s; and check the image URL by opening it directly. Also check filename case: Background.jpg is different from background.jpg on many servers.

A minimal correct example for the head (move your link into head) looks like:

<head>
  <meta charset="utf-8">
  <title>…</title>
  <link rel="stylesheet" type="text/css" href="frontpage.css">
</head>

Remember that URLs inside a CSS file are resolved relative to the CSS file location. If frontpage.css lives in css/ and the image is in images/, the CSS URL must point from the css/ folder (for example ../images/Background.jpg), or use an absolute path like /images/Background.jpg.

Quick checklist: fix HTML structure and link tag; verify frontpage.css loads; confirm the image URL (open directly); fix path/case if CSS is in a subfolder; clear cache/force refresh. For details about link and how url() paths are resolved, see the MDN docs: HTML link element and [CSS url()](https://developer.mozilla.org/en-US/docs/Web/CSS/url()).

Recommended Answers

All 4 Replies

you should not add div tag before body tag

<div id="body">
<body>
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Mauris consectetur nunc quis orci feugiat a semper lectus interdum. Aliquam ipsum metus, mollis sed commodo nec, blandit nec tortor. Nulla eget massa sem. Nullam cursus libero eu massa consectetur et fringilla lectus sodales. Ut tempor, eros vel consequat convallis, erat nulla convallis ipsum, id rutrum ipsum ante eget leo. Vivamus hendrerit auctor tortor ut dapibus. In nec lorem diam, hendrerit pretium diam. Nulla varius porta congue.
</body>
 
</div>

Just remove the div it should work, if it did not work try the following css, but you should remove div tag before body

body
{
 background: url(background.jpg)
}

The CSS should be:

body {
 background: url("background.jpg");
}

I've put a semi-colon and double quotes.

It only works when I place this in the same file:

<style type="text/css">
body {
	background: url("Background.jpg");
}
</style>

It does not work when I write it in frontpage.css

Why is it?

try placing your images in an images folder and executing your code as follows:

background-image: url(../Images/sample.jpeg);

let me know if that helps!

Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.