Div background properties don't show up in FF,IE and Opera.

Dear all,

First time poster, so first of all hello to everyone!

I tried looking up for similr problem on the forum but must have missed it, so here goes:

This code works fine on safari, but fails to show the background, be it an image or colour in ll other browsers - IE, FF and Opera, in Windows and OS X, please can you help me sort out this issue?


<!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>menuTemplate</title>
<style type="text/css">
<!--
body {
background-color: #CCCCCC;
}#menu1stTier {
width: 794px;
height: 25px;
background-color: c08f48;
}
#menu1stTier ul {
list-style: none;
margin-top: 0px;
padding-left: 2px;
}
#menu1stTier li {
float: left;
}
#menu1stTier li a {
margin-left: 0px;
display: block;
padding-top: 8px;
padding-right: 10px;
padding-left: 10px;
padding-bottom: 5px;
color: #FFFFFF;
font-family: Georgia, "Times New Roman", Times, serif;
font-weight: normal;
font-size: 70%;
text-transform: lowercase;
text-decoration: none;
}
#menu1stTier li a:hover {
text-decoration: none;
color: #CCFFFF
}
/*- the different links -*/
#1stTier01 a:hover {
background-image: url(../images/menu-bkg1st01.png);
background-repeat: repeat-x;
}
#1stTier02 a:hover {
background-image: url(../images/menu-bkg1st02.png);
background-repeat: repeat-x;
}
#1stTier03 a:hover {
background-image: url(../images/menu-bkg1st03.png);
background-repeat: repeat-x;
}
#1stTier04 a:hover {
background-image: url(../images/menu-bkg1st04.png);
background-repeat: repeat-x;
}
-->
</style>
</head>
<body>
<div id="menu1stTier">
<ul>
<li id="1stTier01"><a href="test">Home</a></li>
<li id="1stTier02"><a href="test">World Tour</a></li>
<li id="1stTier03"><a href="test">Podcasts</a></li>
<li id="1stTier04"><a href="test">Forum</a></li>
</ul>
</div>
 </body>
</html>

I am a newb to CSS, so it might be a simple mistake, but its been driving me nuts the past day. So any help would be much appriciated!

Thanks,
badlydrawn.

Div background properties don't show up in FF,IE and Opera.

Div background invisible in FF,IE and Opera - code included

badlydrawn

encyclo

badlydrawn

Join The Conversation

Moderators and Top Contributors

Hot Threads This Week