Shows right in IE but not FF, can you help?

hello,

http://www.cre8tiv-vision.com/nick/montelongo/web.html

I have a site im coding which shows correctly in IE but not FF. Its weird.

The only thing left to be fixed is the fact that the left/right sidebars do not stretch all the way down when the content in the middle goes down. also, if i put a lot of content in the right sidebar, it makes the content and leftbar go down farther than its supposed to and there white at the top like this:

http://www.cre8tiv-vision.com/nick/montelongo/web1.html

If anyone could be of help, i would greatly appreciate it.

Thanks,
- Robert DeVore

 

here is my CSS file coding:

body {
	margin: 0px;
	padding: 0px;
	background-color: #FFFFFFF;
	font-family: Tahoma;
	font-size: 11px;
	color: #000000;
}

a:link { color: #FFFFFFF; text-decoration: underline; font-size: 11px; }
a:visited { color: #FFFFFFF; text-decoration: underline; font-size: 11px; }
a:hover { color: #669E7A; text-decoration: underline; font-size: 11px; }
a:active { color: #FFFFFFF; text-decoration: underline; font-size: 11px; }

td.logoleft {
	background-image: url(images/web_01.png);
	background-position: top;
	background-repeat: no-repeat;
	background-color: #FFFFFF;
	width: 178px;
	height: 152px;
	text-align: center;
	vertical-align: top;
}

td.topbar {
	background-image: url(images/web_02.png);
	background-position: top;
	background-repeat: repeat;
	background-color: #FFFFFF;
	width: 622px;
	height: 39px;
	text-align: center;
	vertical-align: top;
}

td.picturetop {
	background-image: url(images/web_03.png);
	background-color: #FFFFFF;
	background-position: top;
	background-repeat: no-repeat;
	width: 454px;
	height: 154px;
	padding: 0 0 0 0;
              margin: 0 0 0 0;
	text-align: center;
	vertical-align: center;
}

td.leftbar {
	background-image: url(images/web_05.png);
	background-position: top;
	background-repeat: repeat;
	background-color: #FFFFFF;
	width: 178px;
	height: 100%;
	text-align: left;
	font-family: Tahoma;
	font-size: 11px;
	color: #FFFFFF;
	vertical-align: top;
}

td.rightside {
	background-image: url(images/web_04.png);
	background-position: top;
	background-repeat: no-repeat;
	background-color: #F1EEE0;
	width: 168px;
	height: 100%;
	text-align: center;
	font-family: Tahoma;
	font-size: 11px;
	color: #000000;
	vertical-align: top;
}

#topright {
    float: right;
    width: 168px;
    height: 28px;
    vertical-align: middle;
    display: inline; /* fix IE double margin bug */
    background: transparent url(images/right-top.gif) 0 0;
    }

#topright ul {
    list-style: none;
    margin: 0 32px 0 24px;
    padding: 0px;
    }
    
#topright ul li {
    background: transparent url(images/right-bullet.gif) no-repeat left center;
    padding: 5px 0 3px 14px;
    margin: 0;
    font-family: Century Gothic;
    font-size: 13px;
    color: #00006E;
    }

#topnav {
    clear: both;
    list-style: none;
    background: #262772;
    margin: 0px 0px;
    vertical-align: center;
    padding-left: 2px;
    width: 170px;
    text-align: left;
    }
    
#topnav li {
    display: list-item;
    padding-top: 6px;
    margin: 0px 0 0 0;
    height: 20px;
    vertical-align: center;
    position: relative;
    background: #262772 url(images/nav-lines.gif);
    }
    
#topnav li.last {
    border-bottom: 1px solid #606198;
    }

#topnav li a {
    text-decoration: none;
    color: #FFFFFF;
    font-size: 14px;
    padding-left: 10px;
    vertical-align: center;
}
    
#topnav li a:hover {
    text-decoration: none;
    color: #E1DFD1;
    font-size: 14px;
    }

td.content {
    float: right;
    width: 454px;
    height: 507px;
    vertical-align: top;
    margin: 0 0 0 0;
    padding: 0 0 0 0;
    display: inline; /* fix IE double margin bug */
    background: transparent url(images/contentbg.gif) 0 0;
    }

#content {
    float: right;
    width: 454px;
    vertical-align: top;
    text-align: left;
    padding: 0px 0 0 0;
    margin: 0 0 0 0;
    display: inline; /* fix IE double margin bug */
    background: transparent url(images/slashbg.gif) 0 0;
    }
    
#content h1 {
    color: #00016F;
    font-size: 18px;
    text-align: left;
    font-family: Century Gothic;
    border-bottom: 1px solid #00016F;
    margin: 0em 8px 1em 8px;
    vertical-align: top;
    }
    
#content p {
    padding-left: 2px;
    vertical-align: top;
    }
    
#content .shadow {
    width: 454px;
    padding: 0 0px 16px 0px;
    margin: 0 0 0 0;
    vertical-align: top;
    background: transparent url(images/shadow.gif) no-repeat bottom center;
    }

#content .words {
    width: 450px;
    padding-left: 4px;
    margin: 0 0 0 0;
    vertical-align: top;
    }

#bottom {
    float: right;
    width: 454px;
    padding: 0px 0 0 0;
    vertical-align: top;
    display: inline; /* fix IE double margin bug */
    background: transparent url(images/slashbg.gif) 0 0;
    }
    
#bottom p {
    padding-left: 4px;
    vertical-align: top;
    }

#rightside {
    float: right;
    width: 160px;
    vertical-align: top;
    text-align: left;
    padding: 0px 0 0 0;
    margin: 0 0 0 0;
    display: inline; /* fix IE double margin bug */
    }

Code (markup):

not sure if you would need to look at it.

- Robert DeVore

 

fixed. this can be closed now.