CSS image problems?

**Zealster** · 12-12-2005, 11:13 PM

Alright, for about 2 months, I've had the same problem. What happens is when I start coding, I usually start to use Internet Explorer. I've been using Firefox since them, and have come to love Firefox. So I'm trying to make a cross browser website, so I put in doctype declarations and validate it using w3 validator.

But the problem is, when I put in the doctypes, the images stop showing up, but everything else works. Any suggestions?

Here's the code:

[The Page itself (Not completely validated, I just threw in the doctype tag)]

HTML Code:

<!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" xml:lang="en">
<head>
<link rel="Stylesheet" href="default.css" content="text/css" media="screen" />
<title>TEST</title></head>
<body>
<div class="main"><div class="subtop"><font class="menu">Hello 

world!</font></div><font>Hello world!</font></div><div class="bottom">
</body>
</html>

[The CSS external sheet]

Code:

body { background: #FFF; }
font { font-size: 12px; color: #000; font-family: Arial; }
font.menu { font-size: 14px; color: #000; font-family: Arial; }
div.main { background: #3399FF url('images\back.jpg') no-repeat fixed; width: 999px; height: 400px; border: 1px solid; position: absolute; top: 100px; left: 1px; }
div.subtop { width:  999px; height: 25px; border: 1px solid; position: relative; vertical-align: middle; }
div.bottom { background-color: #CCE6FF; border: 1px solid; height: 10px; width: 200px; position: absolute; bottom: 50px; left: 400px; }