iframe acting different in browsers

[sarb]

Hi,

I have an iframe in my webpage so that a link to a realestate mls page appears in the right side of my two column layout:

http://www.sitesbysarah.com/justin/main_mls.htm

In IE the page in the right frame is overlapped by the footer.

In Firefox it looks fine.

Any idea what is going on in IE? I don't know how to correct this.

Any help would be appreciated.

Thank you,
Sarab

css code below:



/*
Created by Keith Donegan of Code-Sucks.com

E-Mail: Keithdonegan@gmail.com

You can do whatever you want with these layouts,
but it would be greatly appreciated if you gave a link
back to http://www.code-sucks.com

*/

* { padding: 0; margin: 0; }

body {
font-family: Arial, Helvetica, sans-serif;
font-size: 13px;
background-color: #660000;
}

a:link {color: #660000;}
a:visited {color: #660000;}
a:hover {color: #dfc398; text-decoration: underline;}
a {text-decoration: none;}


p {
width: 500px;
padding: 0 20px 10px 30px;
color: #660000;
line-height: 1.8em;
}

h1 {
color: #660000;
font-family: Helvetica, serif;
font-size: 1.2em;
font-weight: 700;

padding: 30px 10px 10px 30px;;
}



#wrapper {
position: relative;
margin: 20px auto;

width: 922px;

}

#header {
color: #333;
width: 900px;
float: left;
background-image: url(images/oldpaper_1000_header_wtext.jpg);
background-repeat: no-repeat;
padding: 10px;
border-left: 1px solid #cdaf75;
border-right: 1px solid #cdaf75;
border-bottom: 20px solid #660000;
height: 70px;
margin: 10px 0px 0px 0px;

}



/*- Menu Tabs C--------------------------- */

#tabsC {
position: absolute;
top:66px;
left:670px;
width:255px;
background: transparent;
font-size:12px;
line-height:normal;
font-family: Arial, sans-serif;

}

#tabsC ul {
margin:0;
padding:10px 10px 0 10px;
list-style:none;

}
#tabsC li {
display:inline;
margin:0;
padding:0;


}
#tabsC a {
float:left;
background:url("images/tableftC_red.gif") no-repeat left top;
margin:0;
padding:0 0 0 4px;
text-decoration:none;


}
#tabsC a span {
float:left;
display:block;
background:url("images/tabrightC_red.gif") no-repeat right top;
padding:5px 15px 4px 6px;
color:#bea167;
font-weight: 800;
}
/* Commented Backslash Hack hides rule from IE5-Mac \*/
#tabsC a span {float:none; }
/* End IE5-Mac hack */
#tabsC a:hover span {
color:#660000;
}
#tabsC a:hover {
background-position:0% -42px;
}
#tabsC a:hover span {
background-position:100% -42px;
}

#tabsC #current a {
background-position:0% -42px;

}
#tabsC #current a span {
background-position:100% -42px;
color:#660000;
}



#leftcolumn {
color: #333;
border-right: 1px solid #660000;
border-left: 1px solid #cdaf75;
border-bottom: 1px solid #cdaf75;
background-image: url(images/oldpaper_1000_leftcol_wbran.jpg);
background-repeat: no-repeat;
margin: 0px 0px 0px 0px;
padding: 10px;
height: 350px;
width: 200px;
float: left;
}
#subnav {

width: 200px;
}

#subnav ul
{
margin-left: 0;
padding-left: 0;
list-style-type: none;
font-family: Arial, Helvetica, sans-serif;
font-size: .9em;
text-indent: 15px;
font-weight: 700;
}

#subnav a
{
display: block;
padding: 3px;
width: 200px;
background-color: transparent;
border-bottom: 1px solid #660000;
text-decoration: none;
}

#subnav a:link, #subnavlist a:visited
{
color: #660000;
text-decoration: none;
}

#subnav a:hover
{
background-color: #660000;
color: #bea167;
}

#active a:link, #active a:visited, #active a:hover{

background-color: #660000;
color: #bea167;
}

#rightcolumn {
float: right;
color: #333;
border-left: 1px solid #660000;
border-right: 1px solid #cdaf75;
border-bottom: 1px solid #cdaf75;
background-image: url(images/oldpaper_1000_rightcol.jpg);
background-repeat: no-repeat;

margin: 0px 0px 0px 0px;
padding: 10px;
height: 350px;
width: 678px;
display: inline;
}
#footer {
width: 900px;
clear: both;
color: #cdaf75;
border: 1px solid #cdaf75;
background: #660000;
margin: 0px 0px 10px 0px;
padding: 10px;
text-align: center;

}

[Charles]

Let's start by correcting these errors: http://validator.w3.org/check?verbose=1&uri=http%3A%2F%2Fwww.sitesbysarah.com%2Fjustin%2Fmain_mls.htm .

Perhaps that'll take care of it; perhaps not. But it's a good place to start.

[WebJoel]

#leftcolumn width tries to 'overlap'. See screenshot: #leftcolumn with border:1px solid white