Forum Moderators: not2easy
Thank you again for your help on the spacing. One more issue and I think I am set for awhile...
Here is both my html and my css. I can't figure out why my page is showing up perfectly (spacing as well) in Mozilla but isn't showing up at all in IE. Only thing showing up is the blue background color, not things on top of it.
Thanks in advance, and thanks a million.. Tobin.
::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>
<link rel="shortcut icon" href="favicon.ico" />
<title>Monkey Tree Records.com :: Home</title>
<link rel="stylesheet" type="text/css" href="index.css" />
<script type="text/javascript" src="scroller.js"></script>
<script type="text/javascript" src="scrollerother.js"></script>
<script language="JavaScript" type="text/JavaScript">
<!--function MM_preloadImages() { //v3.0 var d=document; if(d.images){ if(!d.MM_p) d.MM_p=new Array();
var i,j=d.MM_p.length,a=MM_preloadImages.arguments; for(i=0; i<a.length; i++)
if (a[i].indexOf("#")!=0){ d.MM_p[j]=new Image; d.MM_p[j++].src=a[i];}}}
function submitform() {document.search.submit();}-->
<!--body {
background-image: url();
background-color: #477BA3;}
.style4 {color: #FFFFFF}
a:link {color: #FFFFFF;
text-decoration: none;}
a:visited {
text-decoration: none;}
a:hover {text-decoration: underline;}
a:active {text-decoration: none;}-->
</head>
<body>
<div id="container">
<div class="style4" id="logo"></div>
<div class="style4" id="homenav"></div>
<div class="style4" id="artistnav"></div>
<div class="style4" id="newsnav"></div>
<div class="style4" id="appnav"></div>
<div class="style4" id="shopnav"></div>
<div class="style4" id="contactnav"></div>
<div class="style4" id="artistoftheweek"></div>
<div class="style4" id="ontheroad"></div>
<div class="style4" id="upandcoming"></div>
<div class="style4" id="bandad"></div>
<div class="style4" id="mailinglist"></div>
<div class="style4" id="footer"></div>
</div>
</body>
</html>
::CSS::
=======
#container{
position: absolute;
left:50%;
margin-left: -313px;
top:45px;
width:670px;
height:716px;
background-image: url(bg.jpg);
}
body{
font-family: Tahoma, Verdana, Arial, Helvetica, sans-serif;
background-color:#477BA3;
}
#logo {
position:absolute;
width:450px;
height: 49px;
left: 58px;
top: 48px;
z-index:1;
}
#homenav {
position:absolute;
width: 260px;
height: 17px;
left: 289px;
top:184px;
z-index:1;
}
#artistnav{
position:absolute;
width: 160px;
height: 17px;
left: 290px;
top: 332px;
}
#newsnav{
position:absolute;
width: 160px;
height: 17px;
left: 290px;
top: 332px;
}
#appnav{
position:absolute;
width: 160px;
height: 17px;
left: 290px;
top: 332px;
}
#shopnav{
position:absolute;
width: 160px;
height: 17px;
left: 290px;
top: 332px;
}
#contactnav{
position:absolute;
width: 160px;
height: 17px;
left: 290px;
top: 332px;
}
#artistoftheweek{
position:absolute;
width: 316px;
height: 158px;
left: 10px;
top: 230px;
background-image: url(artistoftheweek.jpg);
}
#ontheroad{
position:absolute;
width: 316px;
height: 158px;
left: 10px;
top: 420px;
background-image: url(ontheroad.jpg);
}
#upandcoming{
position:absolute;
width: 300px;
height: 300px;
left: 310px;
top: 320px;
background-image: url(upandcoming.jpg);
}
You didn't seem to have closed the <script> tag:
<script language="JavaScript" type="text/JavaScript">
<!--function MM_preloadImages() { //v3.0 var d=document; if(d.images){ if(!d.MM_p) d.MM_p=new Array();
var i,j=d.MM_p.length,a=MM_preloadImages.arguments; for(i=0; i<a.length; i++)
if (a[i].indexOf("#")!=0){ d.MM_p[j]=new Image; d.MM_p[j++].src=a[i];}}}
function submitform() {document.search.submit();}-->
The </script> is missing...
