I am new at dealing with tables using DIV, but my second image does not appear

[CdnRebel]

Hi,
I have double checked and triple checked, but I cannot figure out why my second image (the picture in div.top2) is not displaying. The spelling is right. I have attached the files.
Also is there a way of aligning all the pictures towards the centre with the wording beneath lined up nicely as well?

Thanks for any help,
Mary

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">

<HTML>

<HEAD>

<TITLE>Second Page</TITLE>

<STYLE type="text/css">
div#container

{

   width: 800px;
   background-color: black;

   position: relative;

   margin-top: 0px;

   margin-left: auto;

   margin-right: auto;
<p>

}
div.inside
{
float: left;
}
div.top1
{
height:  585px;
width: 400px;
background-color: black;
float: left;
}
div.top2
{
height: 585px;
width: 400px;
background-color: black;
float: right;
clear: right;
}
div.bottom1
{
height: 100px;
width: 400px;
background-color: black;
float: left;
clear: left;
}
div.bottom2
{
height: 100px;
width: 100px;
background-color: black;
float: left;
}
</style>
</head>
<body bgcolor="black">
<BGSOUND src="../heartbeat.wav" loop="-1">
<div class="container" align=center>
<font face="Bloodsuckers" size="7" color="#FF0000">Haunted House and Haunted Castle</font></p>
<IMG src="bloodybar.gif" alt="" border="0" width="800" height="24" style="position:relative;">

<div class="top1"><a href="hauntedhouse1.htm"><IMG src="http://bytes.com/images/hauntedhouse.jpg" alt="link to interior views for haunted house" border="0" width="400" height= "585"></a>
</div>
<div class="top2"><a href="hauntedcastle1.htm"><IMG src="http://bytes.com/images/hauntedcastle.jpg" alt="link to interior views for haunted castle" border="0" width="400" height="585"></a>
</div>
<div style="clear: left"></div>
<div class="bottom1"><a href="hauntedhouse1.htm"><font color="#FF0000">Haunted House--Click for Interior View</font></a>
</div>
<div style="bottom2"><a href="hauntedcastle1.htm"><font color="#FF0000">Haunted Castle--Click for Interior View</font></a>
</div>
</div>
<div align="center">
<p><P><P>&nbsp;<b><font color="#FF0000"><a href="index.htm"><font color="#FF0000">Home</font></a>
</div>
</BODY>

</HTML>

[Markus]

I don't see your issue. Do you have a live server we can view the website on?

[CdnRebel]

New to using DIV to replace a table, main image is not appearing

I have stripped the code down to the following and my image is not appearing.
The code below is saved in a temporary htm file and the image is stored in an images folder. Why is my image not displaying when I click on the htm file? It was displaying at one point. I thought I had saved a copy of the code where it did display, but I have resized the image since and it does not display now. This is the only problem I have left to deal with before uploading the changes.
Any help would be greatly appreciated.

Thanks,
Mary


<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<HTML>
<HEAD>
<META http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<TITLE>Home Page</TITLE>
<STYLE type="text/css">
div.container
{
width: 1100px;
background-color: black;
position: relative;
margin-top: 0px;
margin-left: auto;
margin-right: auto;
text-align: left;
}
div.top1
{
height: 765px;
width: 550px;
background-color: black;
float: left;
}
div.outside
{
height: 100px;
width: 1100px;
background-color: black;
float: left;
clear:left;
}
</STYLE>
</HEAD>
<BODY bgcolor="#00000 0" text="#000000" link="#FFFF00" vlink="#FFFFFF" style="SCROLLBA R-FACE-COLOR:#C0C0C0;S CROLLBAR-ARROW-COLOR:#000000;S CROLLBAR-3DLIGHT-COLOR:#C0C0C0;S CROLLBAR-DARKSHADOW-COLOR:#000000;S CROLLBAR-HIGHLIGHT-COLOR:#FFFFFF;S CROLLBAR-SHADOW-COLOR:#808080;S CROLLBAR-TRACK-COLOR:#C0C0C0;" >

<DIV id="container" style="width: 1100; align=center">
<div class="top1"><I MG src="images/hauntedhouse.jp g" alt="link to interior views for haunted house" border="0" width="550" height= "765">
</div>
</div>
<div.outside>
<p><P><P>&nbsp; <b><font color="#FF0000" ><a href="index.htm "><font color="#FF0000" >Home</font></a>&nbsp;&nbsp;
</div>
</BODY>

</HTML>

[CdnRebel]

Code was corrected and now first image doesn't appear

[CdnRebel]

Problem is resolved

Hi Markus,

It turns out that I had to save the pictures as .gif files for them to display. I thought the problem might have been my code.

Thanks,
Mary